Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8
  1. #1
    New to the CF scene
    Join Date
    May 2009
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Column Problem in IE - Blog

    In the course of making my first blog, I have run in to a severe roadbump. My columns are not displaying side by side as intended. In FIREFOX they are displaying properly and I have no issues. In IE, the sidebar jumps to the bottom no matter what I try to do. At first I figured it was a slight miscalculation of widths but I have been unable to correct the problem no matter the amount of stuff I change.

    Any help would be appreciated.

    It works in IE before it is put in the blog.
    http://www.bearfootstudio.com/freethedream/

    Otherwise it fails. www.freethedream.com

    The CSS is a bit long to post (and unfortunately a bit messy)
    http://freethedream.com/wp-content/t...ream/style.css

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,956
    Thanks
    9
    Thanked 727 Times in 721 Posts
    You have a few validation errors, most of which are alt tags, but there's an extra </div> somewhere which might be contributing. Worth sorting this out first.

  • #3
    New to the CF scene
    Join Date
    May 2009
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Cleaned up Validation issues (minus the one it has with a 'label' tag that's part of the search plugin. Removed search completely and it still didn't fix the problem so it's not that)

    Need help. Apparently it shows up in IE 8.0 correctly, just not 7...and I'd assume 6, since 6 hates everything anyways.

  • #4
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,956
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Been playing around with this for a while. Is it possible that your html has got changed in the transfer?

    On the "correct" version you have

    Code:
    #content{margin:0px auto}
    #columns{margin:0px auto;width:900px}
    and #sidebar is nested within #columns. But on the "wrong" version #sidebar is not nested within #columns and columns is still 900px wide, hence causing the float drop, because #sidebar won't fit?? Why it's OK in FF I'm not sure.

  • #5
    New to the CF scene
    Join Date
    May 2009
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Good god I feel stupid. I am surprised I didn't figure that out before. Thanks a lot, I know you spent quite a bit of time scanning through my code. My first attempt at a blog has been a bit challenging but I'm glad it's 'mostly' done now. Thanks again.

  • #6
    New Coder
    Join Date
    May 2009
    Location
    Germany
    Posts
    12
    Thanks
    1
    Thanked 0 Times in 0 Posts
    I have the same problem. When my blog is loaded in IE 6 everything in my right sidebar drops down to left bottom. My site: DT´s Flash Drive Blog - Recent Posts. I've been told in later IE versions it displays find as well as with firefox, safari etc. Is there something wrong with my sidebar-right.php or something with my css? Would greatly appreciate any feedback.
    Here's the code of my right sidebar:
    Code:
    		<!-- Sidebar -->
    		<div class="sidebar sidebar-right">
    		
    			<h3>RSS Feed</h3>
    			<div id="sidebar-feed">
    				<a href="<?php bloginfo('rss_url'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/rss_feed.jpg" alt="RSS Feed" width="160" height="60" /></a>
    			</div>
    			
    			<h3>Search</h3>
    			<form id="searchform" method="get" action="http://www.usbmemorysticks.net/">
    					<div>
    					<input type="text" name="s" id="s" size="15" /><br />
    					<input type="submit" value="Search" />
                				</div>
                				</div>		
    		<!-- Sidebar -->
    The other elements come from the wordpress widget and no matter if I rearrange everything through there or put everything in the sidebar-right.php, IE still has this display error. So I guess it's my stylesheet? Unfortunately I'm pretty new to all this...
    Last edited by FlashDriveDT; 05-24-2009 at 02:12 PM.

  • #7
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    Have a try by removing the widths from the inner elements of right side bar, say from
    .sidebar #searchform and .sidebar h3
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #8
    New Coder
    Join Date
    May 2009
    Location
    Germany
    Posts
    12
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Nice idea but unfortunately that didn't fix it. I just noticed another strange thing: Between the search box and the elements below that is quite a gab. In Firefox its relatively small and negligable, but in IE its huge.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •