OK, I'm redesigning my site and found a three column layout that I liked and adjusted my review page to those configurations. This template uses <div> tags and I noticed that instead of single apostophes it shows up as an empty square box or a question mark. By the way, the page uses MySQL to get the data.<br /><br />Also, on a larger screen (1024x768), it shows up fine but on something smaller (800x600), the middle section gets (for the lack of a better word) squished down to the bottom of the page.<br /><br />Here's the page I'm talking about:<br /><a href="http://www.moviemansguide.com/reviews/DVD/tmp_read.php?id=unknown" target="_blank">http://www.moviemansguide.com/reviews/DVD/....php?id=unknown</a><br /><br />Plus the home page (where this also happens)<br /><a href="http://www.moviemansguide.com/test-index3.php" target="_blank">http://www.moviemansguide.com/test-index3.php</a><!--content-->
It works correctly in Firefox at all resolutions. If I look at it in IE it does as you describe. Another reason to abandon IE in my opinion.<br /><br />In your CSS it has this:<br /><br /><!--c1--><div class='codetop'>CODE</div><div class='codemain'><!--ec1-->#leftcol {<br />Â Â float: left;<br />Â Â margin: 0 0 0 0;<br />Â Â width: 150px;<br />}<br /><br />#main {<br />Â Â margin: 0px;<br />}<br /><br />#centercol {<br />Â Â margin: 0 220px 0 170px;<br />}<br /><br />#rightcol {<br />Â Â float: right;<br />Â Â margin: 0 0 0 0;<br />Â Â width: 220px;<br />}<!--c2--></div><!--ec2--><br /><br />Your left column is 150 pixels wide (#leftcol)<br />Your center column is shifted 220 pixels from the left edge and 170 pixel from the right edge (#centercol)<br />Your right column is 220 pixels wide (#rightcol)<br /><br />So your sidebars are totaling 370 pixels in size so on larger resolutions it's displaying properly.<!--content-->
I guess I'll try adjusting the numbers and maybe get it down some... But I have seen other sites that the side bars stay the same and the middle adjusts, yet doesn't do what mine has.<br /><br /><br />Another thing (and this doesn't really pertain to this issue, more of curiosity), but I use a spacer.gif image on one of the sidebars and in MSN Explorer (which I think uses the same kind of coding as IE), there's a bar that shows even if I specify border="0". Just odd but not that pressing to fix.<!--content-->
What happens if you move this <!--coloro:blue--><span style="color:blue"><!--/coloro--><div id="main"><!--colorc--></span><!--/colorc--> above the <!--coloro:red--><span style="color:red"><!--/coloro--><div id="leftcol"><!--colorc--></span><!--/colorc--> instead of below it?<br /><br />I think that tag is out of place. It is your main body below the header and your left, right and center columns should be inside of it. <br /><br />I use a 3-column theme on my site and it resizes at all resolutions correctly.<!--content-->
Still does the same thing. I've updates the page:<br /><br /><a href="http://www.moviemansguide.com/test-index3.php" target="_blank">http://www.moviemansguide.com/test-index3.php</a><br /><br /><br />I also sized down the left sidebar and while it's smaller than I like, I think it'll work on the 800x600 resolution.<br /><br /><br />Edit: Just checked and it still doesn't work on that resolution...<!--content-->
Still haven't really solved the problem per se, but I did set (within #main) the width to 1010 so the middle section won't do that on smaller resolutions, the trade-off however is, there will be a horizontal scroll.<br /><br />One other question, I noticed this on another site using 1024x768 that there is still the horizonal scrollbar where you can only move over a little. I had put in a code to remove this but in order to do the fixed width size, I needed to remove that piece.<!--content-->
You don't need to adjust your sidebars. You are using tables inside the div's. These tables are set to 100% change them to 97% and I bet it works in IE.<!--content-->
Three column layouts can be tricky.<br />A good site to look at is <!--coloro:#0000FF--><span style="color:#0000FF"><!--/coloro-->http://www.realworldstyle.com/<!--colorc--></span><!--/colorc--><!--content-->
<!--quoteo(post=199685:date=Jan 31 2007, 06:46 PM:name=TCH-Bruce)--><div class='quotetop'>QUOTE(TCH-Bruce @ Jan 31 2007, 06:46 PM) <a href="http://www.totalchoicehosting.com/forums/index.php?act=findpost&pid=199685"><img src='http://www.totalchoicehosting.com/forums/style_images/1/post_snapback.gif' alt='*' border='0' /></a></div><div class='quotemain'><!--quotec-->You don't need to adjust your sidebars. You are using tables inside the div's. These tables are set to 100% change them to 97% and I bet it works in IE.<!--QuoteEnd--></div><!--QuoteEEnd--><br /><br />So I adjusted it and it still does the same thing and now even if I adjust it slightly the middle section goes to the bottom. I know it's a matter of adjusting the numbers, but this thing is really bugging me now, lol. <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/tongue_ss.gif" style="vertical-align:middle" emoid=":tongue_ss:" border="0" alt="tongue_ss.gif" /><!--content-->
Thanks for the link Don. I had actually found something similar (<!-- m --><a class="postlink" href="http://webdesign.about.com/od/freewebtemplates/p/blbetter3col.htm">http://webdesign.about.com/od/freewebte ... er3col.htm</a><!-- m -->) and was trying to adapt that. If I find an extra spurt of energy, I might try this over without using tables, but I need to learn more about <div> tags.<br /><br />BTW, do div tags have an effect on apostophes and such? I noticed on that first link (in my first post) that instead of ', there's an empty box or (on another computer), it's a question mark. If I edit the review and replace the apostrophe , it'll show fine (the one in the review is taken from Word).<!--content-->
Firefox displays the page properly. Look at the screen resolution in this image.<br /><br /><img src="http://pdabruce.us/movieman.jpg" border="0" class="linked-image" /><!--content-->
Maybe IE cannot display it properly because it won't <a href="http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.moviemansguide.com%2Ftest-index3.php" target="_blank">validate</a>.<!--content-->
Yeah, but since IE is so quirky, I don't want it to look so strange. I'm going to research the div tags and see how to do what I need instead of using tables since that seems to be the trouble.<br /><br />Thanks for your help guys, in any case. <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/smile.gif" style="vertical-align:middle" emoid="
" border="0" alt="smile.gif" /><!--content-->
<!--quoteo(post=199691:date=Jan 31 2007, 07:08 PM:name=TCH-Bruce)--><div class='quotetop'>QUOTE(TCH-Bruce @ Jan 31 2007, 07:08 PM) <a href="http://www.totalchoicehosting.com/forums/index.php?act=findpost&pid=199691"><img src='http://www.totalchoicehosting.com/forums/style_images/1/post_snapback.gif' alt='*' border='0' /></a></div><div class='quotemain'><!--quotec-->Maybe IE cannot display it properly because it won't <a href="http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.moviemansguide.com%2Ftest-index3.php" target="_blank">validate</a>.<!--QuoteEnd--></div><!--QuoteEEnd--><br /><br />That was because (where this error ocured) the guys last name was an unsupported symbol. This showed up fine using tables (<!-- m --><a class="postlink" href="http://www.moviemansguide.com/reviews/movie/read.php?id=childrenofmen">http://www.moviemansguide.com/reviews/m ... ldrenofmen</a><!-- m -->) but not in the div tables. I corrected it, but didn't hlpe any.<!--content-->
Just wanted to thank all you guys for your help. I ended up sticking with tables without the div tag and just re-designed my <a href="http://www.moviemansguide.com" target="_blank">home page</a> and made the width to 765pixels which looks fine on a 800 x 600 monitor.<br /><br />Anyways thanks everyone <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/smile.gif" style="vertical-align:middle" emoid="" border="0" alt="smile.gif" /> <br /><br /><img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/tchrocks!.gif" style="vertical-align:middle" emoid=":tchrocks!:" border="0" alt="tchrocks!.gif" /><!--content-->
Sorry we couldn't get that other layout working for you. But glad you have a design you are happy with.<!--content-->
It works correctly in Firefox at all resolutions. If I look at it in IE it does as you describe. Another reason to abandon IE in my opinion.<br /><br />In your CSS it has this:<br /><br /><!--c1--><div class='codetop'>CODE</div><div class='codemain'><!--ec1-->#leftcol {<br />Â Â float: left;<br />Â Â margin: 0 0 0 0;<br />Â Â width: 150px;<br />}<br /><br />#main {<br />Â Â margin: 0px;<br />}<br /><br />#centercol {<br />Â Â margin: 0 220px 0 170px;<br />}<br /><br />#rightcol {<br />Â Â float: right;<br />Â Â margin: 0 0 0 0;<br />Â Â width: 220px;<br />}<!--c2--></div><!--ec2--><br /><br />Your left column is 150 pixels wide (#leftcol)<br />Your center column is shifted 220 pixels from the left edge and 170 pixel from the right edge (#centercol)<br />Your right column is 220 pixels wide (#rightcol)<br /><br />So your sidebars are totaling 370 pixels in size so on larger resolutions it's displaying properly.<!--content-->
I guess I'll try adjusting the numbers and maybe get it down some... But I have seen other sites that the side bars stay the same and the middle adjusts, yet doesn't do what mine has.<br /><br /><br />Another thing (and this doesn't really pertain to this issue, more of curiosity), but I use a spacer.gif image on one of the sidebars and in MSN Explorer (which I think uses the same kind of coding as IE), there's a bar that shows even if I specify border="0". Just odd but not that pressing to fix.<!--content-->
What happens if you move this <!--coloro:blue--><span style="color:blue"><!--/coloro--><div id="main"><!--colorc--></span><!--/colorc--> above the <!--coloro:red--><span style="color:red"><!--/coloro--><div id="leftcol"><!--colorc--></span><!--/colorc--> instead of below it?<br /><br />I think that tag is out of place. It is your main body below the header and your left, right and center columns should be inside of it. <br /><br />I use a 3-column theme on my site and it resizes at all resolutions correctly.<!--content-->
Still does the same thing. I've updates the page:<br /><br /><a href="http://www.moviemansguide.com/test-index3.php" target="_blank">http://www.moviemansguide.com/test-index3.php</a><br /><br /><br />I also sized down the left sidebar and while it's smaller than I like, I think it'll work on the 800x600 resolution.<br /><br /><br />Edit: Just checked and it still doesn't work on that resolution...<!--content-->
Still haven't really solved the problem per se, but I did set (within #main) the width to 1010 so the middle section won't do that on smaller resolutions, the trade-off however is, there will be a horizontal scroll.<br /><br />One other question, I noticed this on another site using 1024x768 that there is still the horizonal scrollbar where you can only move over a little. I had put in a code to remove this but in order to do the fixed width size, I needed to remove that piece.<!--content-->
You don't need to adjust your sidebars. You are using tables inside the div's. These tables are set to 100% change them to 97% and I bet it works in IE.<!--content-->
Three column layouts can be tricky.<br />A good site to look at is <!--coloro:#0000FF--><span style="color:#0000FF"><!--/coloro-->http://www.realworldstyle.com/<!--colorc--></span><!--/colorc--><!--content-->
<!--quoteo(post=199685:date=Jan 31 2007, 06:46 PM:name=TCH-Bruce)--><div class='quotetop'>QUOTE(TCH-Bruce @ Jan 31 2007, 06:46 PM) <a href="http://www.totalchoicehosting.com/forums/index.php?act=findpost&pid=199685"><img src='http://www.totalchoicehosting.com/forums/style_images/1/post_snapback.gif' alt='*' border='0' /></a></div><div class='quotemain'><!--quotec-->You don't need to adjust your sidebars. You are using tables inside the div's. These tables are set to 100% change them to 97% and I bet it works in IE.<!--QuoteEnd--></div><!--QuoteEEnd--><br /><br />So I adjusted it and it still does the same thing and now even if I adjust it slightly the middle section goes to the bottom. I know it's a matter of adjusting the numbers, but this thing is really bugging me now, lol. <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/tongue_ss.gif" style="vertical-align:middle" emoid=":tongue_ss:" border="0" alt="tongue_ss.gif" /><!--content-->
Thanks for the link Don. I had actually found something similar (<!-- m --><a class="postlink" href="http://webdesign.about.com/od/freewebtemplates/p/blbetter3col.htm">http://webdesign.about.com/od/freewebte ... er3col.htm</a><!-- m -->) and was trying to adapt that. If I find an extra spurt of energy, I might try this over without using tables, but I need to learn more about <div> tags.<br /><br />BTW, do div tags have an effect on apostophes and such? I noticed on that first link (in my first post) that instead of ', there's an empty box or (on another computer), it's a question mark. If I edit the review and replace the apostrophe , it'll show fine (the one in the review is taken from Word).<!--content-->
Firefox displays the page properly. Look at the screen resolution in this image.<br /><br /><img src="http://pdabruce.us/movieman.jpg" border="0" class="linked-image" /><!--content-->
Maybe IE cannot display it properly because it won't <a href="http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.moviemansguide.com%2Ftest-index3.php" target="_blank">validate</a>.<!--content-->
Yeah, but since IE is so quirky, I don't want it to look so strange. I'm going to research the div tags and see how to do what I need instead of using tables since that seems to be the trouble.<br /><br />Thanks for your help guys, in any case. <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/smile.gif" style="vertical-align:middle" emoid="
" border="0" alt="smile.gif" /><!--content--><!--quoteo(post=199691:date=Jan 31 2007, 07:08 PM:name=TCH-Bruce)--><div class='quotetop'>QUOTE(TCH-Bruce @ Jan 31 2007, 07:08 PM) <a href="http://www.totalchoicehosting.com/forums/index.php?act=findpost&pid=199691"><img src='http://www.totalchoicehosting.com/forums/style_images/1/post_snapback.gif' alt='*' border='0' /></a></div><div class='quotemain'><!--quotec-->Maybe IE cannot display it properly because it won't <a href="http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.moviemansguide.com%2Ftest-index3.php" target="_blank">validate</a>.<!--QuoteEnd--></div><!--QuoteEEnd--><br /><br />That was because (where this error ocured) the guys last name was an unsupported symbol. This showed up fine using tables (<!-- m --><a class="postlink" href="http://www.moviemansguide.com/reviews/movie/read.php?id=childrenofmen">http://www.moviemansguide.com/reviews/m ... ldrenofmen</a><!-- m -->) but not in the div tables. I corrected it, but didn't hlpe any.<!--content-->
Just wanted to thank all you guys for your help. I ended up sticking with tables without the div tag and just re-designed my <a href="http://www.moviemansguide.com" target="_blank">home page</a> and made the width to 765pixels which looks fine on a 800 x 600 monitor.<br /><br />Anyways thanks everyone <img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/smile.gif" style="vertical-align:middle" emoid="
" border="0" alt="smile.gif" /> <br /><br /><img src="http://www.totalchoicehosting.com/forums/style_emoticons/default/tchrocks!.gif" style="vertical-align:middle" emoid=":tchrocks!:" border="0" alt="tchrocks!.gif" /><!--content-->Sorry we couldn't get that other layout working for you. But glad you have a design you are happy with.<!--content-->