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 5 of 5
  1. #1
    New Coder
    Join Date
    Jan 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Help needed with <ul>, client visiting today

    Hey guys, I'm hoping that you guys can give me some advice for a <ul> that's funky in IE.


    Please check out www.keystonehomestx.com/element

    The list shows up fine in Opera, but displays wrongly in IE.

    I used extra padding-bottom to make the active tab seem to have no border-bottom.

    Help appreciated! The client is coming to visit in a few hours!

    James

    P.S. The green background is for viewing purposes only - why the margin in Opera? It seems fine in IE.

  • #2
    Regular Coder
    Join Date
    Jul 2004
    Location
    mile high city
    Posts
    482
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I had a similar issue with IE when using an unordered list this way.

    Declaring a width on the ul itself caused the top and bottom borders of the inline list items to disappear. I ended up removing the width declaration from the ul and letting it expand to the width of its parent container.

    But your layout is a more 'pixel-perfect' approach, so you could try enclosing the ul in a div, and apply the necessary width to the div instead.
    Computer, kill Flanders... Did I hear my name? My ears are burning...
    Good start. Now finish the job.

  • #3
    New Coder
    Join Date
    Jan 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks alot, mcdougals.

    I added a div around the ul, took the width property off of the ul, and that cleared up the bottom of the ul issue atleast. I then added 10px (more than 10px would also work, maybe a little less too) to the padding-top of the div. Looks as intended!

    Only thing bothering me now is the margin (padding maybe?) underneath the ul and content div in opera.

    Thanks again,
    James

    *** Edit: www.keystonehomestx.com/element updated to show changes. ***

  • #4
    Regular Coder
    Join Date
    Jul 2004
    Location
    mile high city
    Posts
    482
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Not sure about that. You may try adding display:inline; to the news <h2>.
    Computer, kill Flanders... Did I hear my name? My ears are burning...
    Good start. Now finish the job.

  • #5
    New Coder
    Join Date
    Jan 2005
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Odd...

    I changed the margin-top of the h3 from 15px to 0 and the gap disappeared. I supposed that was the ?problem. Now, to figure out how to put some space between the h3 and the top without pulling down the h2.

    I'll keep playing around.


  •  

    Posting Permissions

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