SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Bulleted List and Floating Image

    I having an image that is floated to the left, and an unordered list with 25px of margin on the left. The problem is that when the unordered list is next to the left floated image the margin doesn't take effect. I'm sure my coding is right, because i tried removing the image temporarily and the list was padded. Here is the link.

    http://kobato.clampnow.com/news.php

    By the way, I orginally removed all margin and padding using the following.

    Code:
    * {
    padding: 0;
    margin: 0;
    }
    Last edited by prnoct90; Apr 6, 2008 at 11:58.

  2. #2
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    bump

  3. #3
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I was just testing, and I realized that this problem only shows up in Safari. Any Suggestions?

  4. #4
    Error 404: Life not found silver trophybronze trophy
    Join Date
    Dec 2007
    Location
    UK Nr Manchester
    Posts
    3,460
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Have you tried telling the list to 'clear:left;' ?
    It's 530 people, but do you really get it?
    ImgWebDesign - Web design in Buxton, High Peak, Derbyshire UK.

  5. #5
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Moving to the CSS board. (Also, try increasing the left margin on the list.)

  6. #6
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If the image size is unknown, you could try clear the list with a change from default overflow visible to hidden or auto. E.g.:
    Code CSS:
    #content ul {
    	overflow: hidden;  /* clears list in good browsers, sets haslayout in IE7 */
    	padding-left: 30px; /* browsers uses padding to make room for outside bullet */
    }
    * html #content ul {
    	zoom: 100%; /* IE6 does not set haslayout with the overflow declaration*/
    }
    Happy ADD/ADHD with Asperger's

  7. #7
    SitePoint Zealot
    Join Date
    Mar 2007
    Posts
    141
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much, that fixed my problem!!!


Bookmarks

Posting Permissions

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