GraniteBalls Aging fast 12262 Posts user info edit post |
Okay. I'm trying to do something with CSS on myspace. I want to fill the boxes that I've outlined with black borders with a semi-transparent background. That way the text is easier to read without blocking the image in the background.
Do I have the right code injection here?
filter:alpha(opacity=40); -moz-opacity:.40; opacity:.40;
Here's the code for the site as it stands. I'm just not sure where to edit this in. I keep getting the text at an opacity, instead of filling in the table with an black background with 40% opacity.
<style type="text/css"> body { background-color: rgb(33, 27, 24); background-image: url("http://personal.ecu.edu/atb0407/blackwings.jpg"); background-position: top left; background-repeat: no-repeat; background-attachment: fixed; } table, tr, td { background-color: transparent; border: 0px; }
table table { border: 1px; } table table table table{ border:1px; } table table table { border-width: 1px; border-color: rgb(0, 0, 0); border-style: solid; background-color: transparent; width: 450px; } table table table td { background-color: transparent;
} table table table table { border: 0px; width: auto; } table table table table td { filter:none; } body, div, span, td, p, .orangetext15, .whitetext12, .lightbluetext8, strong, b, u, .redtext, .redbtext, .btext, .text, .nametext, .blacktext10, .blacktext12 { font-family: Arial; font-size: 10px; color: rgb(255,255,255); font-weight: normal; font-style: normal; text-decoration: none; } .nametext { padding: 5px; font-family: sans-serif; font-size: 11px; color: rgb(189, 186, 175); font-weight: bold; font-style: normal; text-decoration: none; display: block; } .whitetext12, .orangetext15 { padding: 5px; font-family: Georgia; font-size: 11px; color: rgb(189, 186, 175); font-weight: bold; font-style: normal; text-decoration: none; display: block; } a.navbar:link, a.navbar:active, a.navbar:visited, a.navbar:hover, a.man:link, a.man:active, a.man:visited, a.man:hover, a, a:link, a:active, a:visited, a:hover, a.navbar:link, a.navbar:active, a.navbar:visited, a.navbar:hover, a.text:link, a.text:active, a.text:visited, a.text:hover, a.searchlinksmall:link, a.searchlinksmall:active, a.searchlinksmall:visited, a.searchlinksmall:hover, a.redlink:link, a.redlink:active, a.redlink:visited, a.redlink:hover { color: rgb(255, 51, 51); font-weight: normal; font-style: normal; text-decoration: none; } a.navbar:hover, a.man:hover, a:hover { color: rgb(255, 51, 51); font-weight: normal; font-style: normal; text-decoration: underline; } a.searchlinksmall:link, a.searchlinksmall:visited, a.searchlinksmall:hover { color: rgb(255,255,255); text-decoration: none; } </style>
I'm learning basic CSS using myspace. lol9/12/2006 12:51:01 PM |
pmc Veteran 372 Posts user info edit post |
Um... I don't use Myspace, but I have this... friend... who does, so:
CSS opacity doesn't apply to the background; it applies to the element. If you set the opacity to 0.4, the entire element, including the text, will have an opacity of 0.4, which I don't believe is the effect you want. To get a semitransparent background, you might try creating a semitransparent image and using it as a background for those elements.
Myspace is a mess to style; not the place to learn CSS. Everything's tables within tables ... within tables. There are few elements with ids, and Myspace won't let you use the '#' selector anyway. Elements belong to classes with poorly-chosen names such as ".orangetext15", which, perfectly logically, means section headings for some, but not all, of the various sections.
{Edit: Due to the horizontal scroll, I've gone back and put a line break after each sentence for readability.}
[Edited on September 12, 2006 at 4:55 PM. Reason : ^] 9/12/2006 4:53:30 PM |