This CSS is REALLY starting to P**** Me off now!?

Question

RIGHT!

The answer I got for this question just doesn't work so I am going to open it up again...

I am making a site on MySpace so I'm allowed to use CSS... They don't allow Javascript so that's out of the question!

Part 1) I want to be able to have various BUTTONS on the screen all in different locations. They need to be made up of a gif image for the normal porition AND different gif images for when the mouse pointer is hovered over the buttons.

Part 2) As the user moves over each button, I want it to display a different bit of text in SEPARATE universal div positioned elsewhere on the screen. (As the pointer moves off the button I want the text to disappear again)

The previous answer was as follows used the following system:


Button text here

Rollover text here

and



This doesn't work...

TI can get this principal to work in IE7 but not IE6...

There MUST be a solution because I've seen it done on a website! Trouble is, I can't access his/her source code for their CSS file...

If someone can PLEASE message me with a decent easy solution... I don't want to "Learn" as I go along, I just want to be creative in MySpace... As far as I'm concerned I don't really want to know the fineties of how it works, I just want it to work! :o)

Thanks!

Answer 1

I think Darwin was right.

Answer 2

You can't easily use CSS to make rolling over one element change another. The only way to do that (as far as I know) is to use sibling selectors, but these don't work in IE6.

The code you've used above should work, but what you want to do, is position the div so that it is over the top of the universal div, so that it looks like the text in that div is changing. You'd probably want to using something like position: absolute, and the relevant placement properties.

What you need to realise, is that what you're trying to achieve goes beyond trivial CSS, and you're going to need to take some time to learn a bit about it to make it work.

Also, take a look at the example I've linked below from CSSPlay, which is similar to what you are trying to achieve.

Answer 3

Internet Explorer and CSS don't mix well. use another browser, that should solve the problem.
sort of.