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 6 of 6
  1. #1
    New Coder
    Join Date
    Aug 2009
    Posts
    13
    Thanks
    1
    Thanked 0 Times in 0 Posts

    IE Problem - Div width not constraining?

    Having a strange issue in all versions of IE. (fine in Firefox)

    Some of the divs aren't holding their width's... Please check out the site - any help would be great!

    http://littletdesigns.com/work.html

    [CODE]
    #wrapper #work {
    clear: left;
    float: left;
    width: 900px;
    }
    #wrapper #work #left {
    width: 375px;
    height: 215px;
    clear: left;
    float: left;
    font-family: Arial, Helvetica, sans-serif;
    color: #391D11;
    font-size: 18px;
    font-weight: bold;
    line-height: 40px;
    }
    #wrapper #work #right {
    clear: right;
    float: left;
    height: 215px;
    width: 475px;
    margin-left: 50px;
    }
    [ICODE]

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,744
    Thanks
    22
    Thanked 1,838 Times in 1,822 Posts
    Hello vraymer,
    You have too many id's. The re-used id's should be classes. Check out the links about validation in my sig below.
    Also look at http://www.tizag.com/cssT/cssid.php fo a very good explanation of the difference between id and class.
    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

  • #3
    New Coder
    Join Date
    May 2009
    Posts
    74
    Thanks
    0
    Thanked 7 Times in 7 Posts
    Try adding the below code in your css:


    img{ padding:0; margin:0;}


    Regards.

  • #4
    New Coder
    Join Date
    Nov 2009
    Location
    Portland Oregon
    Posts
    33
    Thanks
    0
    Thanked 6 Times in 6 Posts
    I ran your page, http://littletdesigns.com/work.html , through the W3C validator...
    http://validator.w3.org/

    You've got a few bugs. To start with, as Excavator says, you've got duplicated IDs on a page. (only one unique ID per page)

  • #5
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Simply try doing the changes in your css

    #navigation is having absolute positioning, change it to relative and delete margin-left. give margin-right:0px instead.

    Use logo with banner image 'images/work-header.jpg' in background itself, and use transparent spacer instead in same div where logo is used to apply linking.

    check floating of both logo's and navigation's div. It will work in all browsers.

  • #6
    New Coder
    Join Date
    Aug 2009
    Posts
    13
    Thanks
    1
    Thanked 0 Times in 0 Posts

    - reply

    Thanks for the help!
    I changed my divs to classes & that fixed my main problem.

    (to Funny Ideas) I'm still having an issue with my logo & nav bar in older versions of IE - they are pushing out to the right hand side.

    I tried making the nav relative, but it pushes my header down (contains a flash file on the home & images on the other pages). Also, I need the logo to position above my header so it can have an overlap effect.

    I'm horrible with positioning so any clarification would be great!


  •  

    Tags for this Thread

    Posting Permissions

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