1 reply [Last post]
red2design
Offline
newbie
Staffordshire
Last seen: 13 years 47 weeks ago
Staffordshire
Joined: 2007-02-06
Posts: 4
Points: 0

Anyone know a decent way to make a background gif 6% transparent so image below show and the text abover stays 100%.

I can make everything in that div 6% but it also make the text 6% which is unreadable. http://development.red2design.co.uk/envisage/news_archive.aspx

any help welcome...

css:

.news_wrapper {
padding: 15px;
width: 310px;
float: left;
height: 60px;
margin: 10px;
background-image: url(../images/template/news_corners.gif);
background-repeat: no-repeat;
filter:alpha(opacity=6);-moz-opacity:.06;opacity:.06;
}
.news_wrapper h1 {
font-size: 12px;
color: #FF7800;
text-decoration: none;
margin: 0px;
padding: 0px;
font-weight: bold;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
filter:alpha(opacity=100);
-moz-opacity:1; opacity:1;
}
.news_wrapper h2 {
font-size: 12px;
font-weight: normal;
color: #333333;
text-decoration: none;
margin: 0px;
padding: 0px;
filter:alpha(opacity=100);
-moz-opacity:1; opacity:1;
}
.news_wrapper h3 {
font-size: 12px;
font-weight: normal;
color: #999999;
margin: 0px;
padding: 0px;
filter:alpha(opacity=100);
-moz-opacity:1; opacity:1;
}

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 18 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

As the div has a fixed width

As the div has a fixed width and height, position the text container after it and apply position:relative and a negative top margin to lift it over the semi-transparent div.