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

Thread: padding woes

  1. #1
    Senior Coder Spudhead's Avatar
    Join Date
    Jun 2002
    Location
    London, UK
    Posts
    1,856
    Thanks
    8
    Thanked 110 Times in 109 Posts

    padding woes

    I've got myself into a bit of a quagmire

    Test page

    I want the green section to be horizontally centre in the blue container, with about 10px margin either side.

    I'm playing about with the width and margins here:

    .lbox_inner{position:relative; float:left; width:575px; margin:0px 0px 0px 10px; padding:4px;}

    but it's going screwy in IE6 - adding 10px of left padding to it shunts it way over to the right. And adding any more makes it overflow the 613px total width. Of course, none of this erratic nonsense happens in Firefox.

    I don't get quite what I've done, but I think it needs a fresh pair of eyes.

    I'm pretty sure I need to leave the float / positioning in there - I dunno if that's causing a conflict but I can't absolutely position the "read more" link down the bottom without relative positioning the parent, and the whole thing is supposed to be floated to fit in the page layout.

    Any suggestions?

  • #2
    Regular Coder
    Join Date
    Jun 2007
    Location
    N. Ireland
    Posts
    351
    Thanks
    16
    Thanked 4 Times in 4 Posts
    IE6 does not adhere to the box model for padding.
    Call in another stylesheet or use CSS conditioning if the browser is IE6 to alter the styles for the affected elements.
    Daemonkin.
    If this was helpful, please add to my reputation
    Thousand Sons - Freelance Web Developer - ninetyonedegrees.com

  • #3
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Did you get this fixed, cause they look the same on FF and IE 6 now.

  • #4
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Haven't looked at it in any detail, but it looks like you might have a problem with IE's double floated margin bug. Try adding display:inline to what you already have for .lbox_inner. If that's the problem, it'll be fixed, with no effect on other browsers.

  • #5
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    Quote Originally Posted by croatiankid View Post
    Haven't looked at it in any detail
    You should then, cause you'll discover that the page looks exactly the same on Firefox 2, IE 6 & 7 and Opera.

    http://img252.imageshack.us/img252/1305/uploadkx7.png
    .
    .


  •  

    Posting Permissions

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