How can I get an hr to fade off into the page color on both ends?
Not an effect. Just the look of the <hr>
Thanks if someone can help :)
Joshua Kidd
0
Junior Poster
Recommended Answers
Jump to PostBy controlling its width?
Jump to PostBy replacing it with an image?
All 7 Replies
lps
71
Posting Pro in Training
By controlling its width?
Dandello
8
Posting Whiz in Training
By replacing it with an image?
lps
71
Posting Pro in Training
no, you can either use it in html code such as
<hr style="width:500px;"/>or you can add class to the line and use CSS to control it.
Before I forget, you can center it by adding margin:auto
Dandello
8
Posting Whiz in Training
Since the request was for a fade - that would imply a gradient from the color of the hr element to the background color, which is why I suggested an image. Maybe a gradient would work. But I doubt it will work in MSIE.
lps
71
Posting Pro in Training
Oh, maybe I misunderstand you meaning. How about if adding shadow to both side of the hr? It work for me, but the problem still in IE7/8 where I use filter to generate the shadow.
Dandello
8
Posting Whiz in Training
Nothing fancy or cool works properly in IE7/8. But apparently it does support gradients in CSS. Look for "CSS gradient background".
Let us know if it works.
Joshua Kidd
0
Junior Poster
WORKED!! Had to make a table with only certain sides gradient because I needed a horizontal hr as well but could not find one.
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.