www.webdeveloper.com
Results 1 to 14 of 14

Thread: Padding / Margin probs.... any ideas?

  1. #1
    Join Date
    May 2003
    Location
    Vancouver, WA
    Posts
    47

    Padding / Margin probs.... any ideas?

    I am having troubles with my page. If you go to www.mrpunkin.com in IE you see the menu on the left with the rollovers. See how its got a 10px margin on top and bottom or so? Now do it in Mozilla, Firebird, Safari, etc and it has a HUGE left margin for the menu. The same is for my thumbnails on the photo page. It seems to not like the margins or padding on the lists, as both my menu and thumbnails are setup as lists.

    Anyone got a solution? The CSS is www.mrpunkin.com/default.css

    Thanks ahead of time.

  2. #2
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    Play with the margin and padding on the ul element.

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  3. #3
    Join Date
    May 2003
    Location
    Vancouver, WA
    Posts
    47
    I have a lot but it doesnt seem to change anything, or it just screws everything up vertically. It seems I can NOT move it to the left anymore, only further to the right.

  4. #4
    Join Date
    Aug 2003
    Location
    In my house
    Posts
    4,004
    Off the top of my head, try adding padding-left: 5px; to your #menulist styles.
    Thousand different paths
    So many sterile ends
    I chose the Devil's path

    Never shall the sun kiss my face
    And caress me with it's burning light
    For I dwell in the shadows
    And sleep side by side with death

  5. #5
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    In your menulist make it position:absolute; See what that does. I would rop the margins all together if I were you and use left:5px; and top:5px; too, but that would be me.
    Last edited by PeOfEo; 01-06-2004 at 08:05 PM.

  6. #6
    Join Date
    May 2003
    Location
    Vancouver, WA
    Posts
    47
    I love you.... honestly. That fixed it, although I used 0 instead of 5px. AMAZING it was that simple. Thanks!

    btw: I had tried the absolute position and it didnt work. This works now though in all my browsers, thanks everyone! it was the padding-left.

  7. #7
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    Originally posted by MrPunkin
    That fixed it
    Yep:

    Originally posted by pyro
    Play with the margin and padding on the ul element.
    IE and Mozilla render them differently, which is why I told you to play with the values for both.

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  8. #8
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    that is why I said use left and not margin and get rid of that all togther, left and absolute to position it 5px from the side of the div.

  9. #9
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    Originally posted by PeOfEo
    make it position:absolute;
    You're addicted to position: absolute;, aren't you?

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  10. #10
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    No, I use relative too, but with the left you would need it (or relative) but I can just see relative causing problems in this situation with how it likes to wrap things.

  11. #11
    Join Date
    Dec 2002
    Location
    High on life
    Posts
    10,104
    Which is why using no positioning at all is the best method. Simply removing the margin and padding is the way to go.

    Personal website http://www.ryanbrill.com/
    Business website: http://www.infinitywebdesign.com/
    TypeSpace http://www.typespace.org/

    I reject your reality and substitute it with my own!

  12. #12
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    Originally posted by pyro
    Which is why using no positioning at all is the best method. Simply removing the margin and padding is the way to go.
    grrrr float:center;

  13. #13
    Join Date
    May 2003
    Location
    Vancouver, WA
    Posts
    47
    well, no matter how its done, right now it reads the exact same in Mozilla, Firebird .7, Safari 1.1, IE6, and Opera 7. I know because I have all these here and have tested them all.
    Last edited by MrPunkin; 01-06-2004 at 11:09 PM.

  14. #14
    Join Date
    Nov 2002
    Location
    Auburn, AL
    Posts
    9,222
    want me to check it in ie 5 and 5.5 for yah? I just previewed it in is 5 and 5.5 and it reads just like ie6 in those two browsers, so you don't have any box model problems, congrats.
    Last edited by PeOfEo; 01-07-2004 at 05:02 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles