SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Dec 2004
    Location
    Finland
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to prevent text wrap under image

    i've been struggling with this problem for a while..

    is there any way to prevent text wrap under the icon when window width is small.

    example: http://extra.division.fi/wrap/x.html

    just try to decrease width of the window and you see that text wraps under the icon. i need it to stay in same place (on the right side of the icon).

  2. #2
    SitePoint Evangelist
    Join Date
    Jul 2006
    Posts
    493
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Move the styles in the Head part.
    You can try :
    Code:
    <style type="text/css">
    img {margin: 5px 5px 0 0;}
    li {white-space: nowrap;float: left;clear:both;}
    ul {list-style: none;}
    </style>

  3. #3
    SitePoint Member
    Join Date
    Dec 2004
    Location
    Finland
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    @Dan_A: your example works but i must use float on image and text to position them precisely by pixel. when they are not floating i cant position them correctly , margin and padding doesn't work

    @all4nerds: i must use icon as link, can't put it in background

  4. #4
    SitePoint Member
    Join Date
    Dec 2004
    Location
    Finland
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the problem with fixed width is that it still wraps text if text is wider than 300 px. it will definitely be wider than 300 px because there will be many levels

    example: http://extra.division.fi/wrap/x.html

  5. #5
    SitePoint Member
    Join Date
    Dec 2004
    Location
    Finland
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry didn't notice "vertical-align:bottom".. oh yes, this is one big step further as it works in IE perfectly. but still wraps in firefox

    http://extra.division.fi/wrap/x.html

  6. #6
    SitePoint Member
    Join Date
    Dec 2004
    Location
    Finland
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    all4nerds, thank you, ten thousand times! you saved my day.

  7. #7
    Drop em if you got em
    Join Date
    May 2003
    Location
    NY
    Posts
    691
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Is white-space: nowrap; widely supported in browsers now? It's been a long time since I've had to do anything that would use it, but I just want to make sure I'm hitting all modern browsers.

  8. #8
    Guru Meditation Error gnarly's Avatar
    Join Date
    Dec 2003
    Location
    Cheltenham, United Kingdom
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, it is.
    Olly Hodgson
    thinkdrastic.net


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
  •