CSS Newbie – HELP!!

[ares0942]

Hey everyone,

I’m actually trying to code 2 DIVS which are next to each other. So far so good.

My Problem is that I want the font to hover, in a different color, when anything of the whole box and also the picture box is hovered.

I cant manage to do that :(

Thank you for your help!!!

Here is what I got so far :)
http://jsfiddle.net/zvpvakaz/5/

[Paulie_D]

I’m not entirely sure what it is you are trying to do but a background image there doesn’t seem right and the html structure seems a little overcomplicated.

My Problem is that I want the font to hover, in a different color, when anything of the whole box and also the picture box is hovered.

if I understand correctly, you want the text to change color when anything inside the div portfoliobox is hovered…right.

Then

.portfoliobox:hover {
color:red; /* example color */
}

should work. Let’s see….

http://jsfiddle.net/zvpvakaz/6/

Yep…I’ve disabled some items but as you can see…it works.

If you needed something else…or extra, we can look into that.

[ares0942]

thx for the fast reply and the help :)!

Okay so you would insert a simple image instead of a background image?

The Hover Effect of the Text Works now, but now the div class “boxoben” disappeared…and these two hover effects should work simultaneously.

And the Text Layer should be above the color hover effect.

[Paulie_D]

Okay so you would insert a simple image instead of a background image?

That depends on what the image is and why you are using it.

See this link for an excellent answer on when-to-use-img-vs-css-background-image

div class “boxoben” disappeared

Yes, I disabled that mostly becuase I’m not clear on what it is you are trying to achieve there.

You want the image to get some sort of overlay and the background of the text div to have the same color effect?

[ares0942]

yep exactly. A colored overlay over the image and the same background-color for the text div

[Paulie_D]

Ok…rather than using an empty div (which you could still do), I use a couple of pseudo-elements

http://jsfiddle.net/zvpvakaz/16/

[ares0942]

thank you so much! :) works perfectly. Saved my day :)!

[Author]

Posts