SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS equivalent of noshade attribute

    Is there a way of removing the groove look of an HR through CSS? I want to avoid using the noshade attribute. If I do use noshade, it causes other side-effects (background image is not tiled/rendered properly, background colour incorrect)
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  2. #2
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,066
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Styling <hr>s can actually be quite tricky. Take a look at these pages:

    http://www.bath.ac.uk/~cs1spw/blog/a.../17/#stylingHR
    http://www.saila.com/usage/tips/#hr

  3. #3
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Unfortunately all the things that are suggested are things I've already tried, e.g.

    border:none;

    and

    border:0px solid #fff;

    Any other ideas, anyone?
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback

  4. #4
    SitePoint Zealot LunaC's Avatar
    Join Date
    Feb 2001
    Posts
    176
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    have you tried a div with a top border?
    ie:

    <div style="height:1px; width:200px; border-top:1px solid black;">
    </div>

    You could change the padding, width, colors etc to suit your page. This can also be added to the bottom of a paragraph, h1 tag etc if you want to underline something.
    ie:

    <h1
    style="border-bottom: 1px dashed black; padding-bottom:0px; color:#c0c0c0;">Heading with dashed underline</h1>

    I've used stuff like this a few times and have dropped using the hr tag completely

  5. #5
    Posts rarely lloydi's Avatar
    Join Date
    Jan 2002
    Location
    Swindon UK
    Posts
    620
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Won't work for two reasons:

    a) Needs to work in Netscape 4. Div does not stretch all the way across. If I do apply 100%, it does not do 100% of container, but instead whole page ... oops

    b) I am more interested in the background image than the border, so it's not a simple fix

    Thansk for trying to help. I'll be honest though, I've given up on this one now!
    Build Your Own Web Site the Right Way!
    A beginners' HTML/CSS book with web standards at its heart
    The Ultimate HTML Reference
    A complete reference, in glorious hardback


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
  •