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 7 of 7
  1. #1
    Regular Coder karinne's Avatar
    Join Date
    May 2006
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Problems with fluid content

    Not sure what I'm doing wrong here. The content columns starts under my menu and for the life of me, I don't know what I'm doing wrong. I've probably just been staring at it for too long. The content (that black and blue menu and the title) should be sitting right beside the side menu.

    * snip link

    Any help would be greatly appreciated.

    Also ... using % for the side menu is not an option. The width that's there has to stay.

    Thanks.
    Last edited by karinne; 12-05-2006 at 01:02 PM. Reason: link removed
    a web design portfolio - blog - last.fm - del.icio.us - widow's walk

    Getting on the Web Standards band-wagon? Get these books - Designing With Web Standards and Web Standard Solutions

  • #2
    Regular Coder karinne's Avatar
    Join Date
    May 2006
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok ... I almost have it working now. I had a clear: both; in my ul stuff...

    Now the menu in FF is not wrapping properly; there one blue box on the same line as the black ones when it should be on the next line with the other

    And in IE, the menu is WAAAY up there
    a web design portfolio - blog - last.fm - del.icio.us - widow's walk

    Getting on the Web Standards band-wagon? Get these books - Designing With Web Standards and Web Standard Solutions

  • #3
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Hello karine,
    I changed the width on 2 of your divs and it seems to work now...

    Code:
     #content #topmenus 
    {
    	height: 40px;
    	margin-bottom: 35px;
    	width: 450px;
    }
    
    #topmenus ul.blackmenu, #topmenus ul.bluemenu
    {
        list-style: none;
        padding: 0;
        /*clear: both;*/
        width: 450px;
    }
    I also noticed that the height/width specifications are listed backwards in your HTML.
    Should be <img src="index_files/ServiceCanada.gif" width="286" height="30" class="servcan">

    Instead of <img src="index_files/GovCanada2.jpg" alt="" class="govcan" height="31" width="85">
    -I have no idea if that makes any difference though.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #4
    Regular Coder karinne's Avatar
    Join Date
    May 2006
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Excavator View Post
    Hello karine,
    I changed the width on 2 of your divs and it seems to work now...

    Code:
     #content #topmenus 
    {
    	height: 40px;
    	margin-bottom: 35px;
    	width: 450px;
    }
    
    #topmenus ul.blackmenu, #topmenus ul.bluemenu
    {
        list-style: none;
        padding: 0;
        /*clear: both;*/
        width: 450px;
    }
    Ah ... thanks for that. Now it's ok in FF but the menu is still appearing over my images in IE.

    Quote Originally Posted by Excavator View Post
    I also noticed that the height/width specifications are listed backwards in your HTML.
    Should be <img src="index_files/ServiceCanada.gif" width="286" height="30" class="servcan">

    Instead of <img src="index_files/GovCanada2.jpg" alt="" class="govcan" height="31" width="85">
    -I have no idea if that makes any difference though.
    That won't change a thing. Attributes don't have to be in a specific order.

    Thanks for helping! It's almost working
    a web design portfolio - blog - last.fm - del.icio.us - widow's walk

    Getting on the Web Standards band-wagon? Get these books - Designing With Web Standards and Web Standard Solutions

  • #5
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Must be an IE6 thing? Menu appears to be in the right place here on FF and IE7.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad

  • #6
    Regular Coder karinne's Avatar
    Join Date
    May 2006
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found my answer. It was a hasLayout problem and resolved by adding

    ul.blackmenu li a, ul.bluemenu li a,#content {height: 1%;}
    a web design portfolio - blog - last.fm - del.icio.us - widow's walk

    Getting on the Web Standards band-wagon? Get these books - Designing With Web Standards and Web Standard Solutions

  • #7
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,675
    Thanks
    22
    Thanked 1,827 Times in 1,811 Posts
    Thanks for posting back karinne!!! I'm researching haslayout now - I've run into it before but I guess I don't know enough about it to recognize it when it's staring right at me.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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