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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Div display issues in IE6

    Hi

    I'm a graphic designer attempting my first site using CSS and div layouts. I've been building it in dreamweaver previewing in IE7 and Firefox 2, and except for a couple of minor issues, it's displaying fine. Then I tried previewing it in IE6... it's completely f**ked! I have div's that should be 2 pixels high (spaces between menu buttons), which display a height of 18px - strangely exactly the height of the buttons they appear between. On further inspection it seems that the 18px issue re-occurs in a few of the other other divs, like the .main-column div.

    I'm not looking for anyone to fix this for me, but maybe just take a look at my code, tell me if there's anything blatantly wrong, and maybe set me on the right path... I'm not even sure where to start, considering that there are none of these issues in the newer browser versions.

    Any help would be much appreciated.

    Cheers

    Here's the code from one of the pages, and I've attached the css file:
    <body>
    <div class="main-column">
    <div class="top-mast-gradient"></div>
    <div class="branded-banner">
    <div onclick="location.href='index.html';" style="cursor:pointer;"class="DM-logo"></div>
    <div class="main-nav-holder-350px">
    <div class="main-nav">
    <div class="nav-gap"></div>
    <div class="highlight-left"></div>
    <div onclick="location.href='about-main.html';" style="cursor:pointer;"class="nav-text">about</div>
    <div class="highlight-right"></div>
    <div class="nav-gap"></div>
    <div class="highlight-space"></div>
    <div onclick="location.href='design-main.html';" style="cursor:pointer;"class="nav-text">design</a></div>
    <div class="highlight-space"></div>
    <div class="nav-gap"></div>
    <div class="highlight-space"></div>
    <div onclick="location.href='illustration-main.html';" style="cursor:pointer;"class="nav-text">illustration</div>
    <div class="highlight-space"></div>
    <div class="nav-gap"></div>
    <div class="highlight-space"></div>
    <div onclick="location.href='news-main.html';" style="cursor:pointer;"class="nav-text">news</div>
    <div class="highlight-space"></div>
    <div class="highlight-space"></div>
    </div>
    </div>
    <div class="telephone-holder">
    <div class="telephone"><span class="style1">tel</span> +27 11 452 9183</div>
    <div class="fax"><span class="style1">fax</span> +27 11 452 9183</div>

    <div class="email"><span class="style1">email</span> enquiries@danielmckay.co.za</div>
    <div align="right"> </div>
    </div>
    </div>
    <div class="orange-band-18px"> <div class="breadcrumb-current-text-holder">about us </div>
    </div>
    <div class="white-line-1px"></div>
    <div class="main-content-holder">
    <div class="menu-holder">
    <div onclick="location.href='services.html';" style="cursor:pointer;"class="menu-button">
    <div class="header-and-button-text-holder">services</div>

    </div>
    <div class="menu-button-spacer"></div>
    <div onclick="location.href='client-list.html';" style="cursor:pointer;"class="menu-button">
    <div class="header-and-button-text-holder">client list</div>
    </div>
    <div class="menu-button-spacer"></div>
    <div onclick="location.href='contact-us.html';" style="cursor:pointer;"class="menu-button">
    <div class="header-and-button-text-holder">contact us</div>
    </div>
    <div class="menu-button-spacer"></div>
    </div>

    <div class="about-content-holder">
    <div class="about-content-image-holder"></div>

    <div class="about-header-holder"></div>
    <div class="orange-strip"></div>
    <div class="about-text-holder">
    <div class="about-text-body">With capabilities in corporate identity, print, multimedia design and illustration,
    we’re dedicated to helping clients gain a competitive advantage
    by designing innovative solutions that satisfy real customer needs.
    For us it’s just the beginning... <br/><br/>With unprecedented growth bringing an
    infusion of young talent, the future is bright for daniel+mckay. We’re
    looking ahead to new challenges in the coming years and beyond,
    continuing to help our clients capture the attention of potential
    customers through compelling design.</div>
    </div>
    </div>
    </div>
    <div class="light-grey-band-730">
    </div>
    </div>


    </body>
    Attached Files Attached Files

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,696
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Quote Originally Posted by richardbecker View Post
    […] just take a look at my code, tell me if there's anything blatantly wrong, […]
    Err… yes: your code.
    It’s hard for me to believe what I see there. OK, before you start on the wrong foot I’m gonna tell you that the whole CSS talk is slightly distracting from the really and actually important thing: For the whole beauty of CSS to take place you need to write semantic HTML. This point is the actual new thing when you switch from tables “to CSS” because you don’t create websites with CSS but with clean, semantic, accessible HTML and only style it with CSS.

    Semantic HTML means that every element has a purpose and is not only added to add some styles with CSS, hence empty elements are just as wrong as tables for layout. You structure and style your content, not add HTML just to style it. The basic thought is: If it doesn’t make sense without styles then it’s wrong.

    As to the height issue: you need to set the line height to zero because it will only be a small as the normal line height if not set specifically. However, if you use semantic code this issue will be obsolete anyway.

  • #3
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks a lot for getting back to me - so it's that bad hey? Ouch. I'll have to soak this in and give it another go... will surely be in touch soon.

    Cheers


  •  

    Posting Permissions

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