-
Dec 8th, 2014, 02:15 PM
#1
Thread Starter
Junior Member
How to use transition for multiple div elements?
At the moment, I'm testing the transition CSS property. I got a div element working according to how I want it whenever I hover i.e. changing background color, text color and border color.
But at the moment, I've added a button inside the div that's supposed to change color too. It works, but I want it to automatically hover at the same time the background changes colors. I'd like to know if it's possible.
css Code:
#item { transition: background-color 0.5s ease; background-color: none; border-style: solid; border-width: 1px; padding: 3px 3% 1% 3%; margin-bottom: 2%; height: 190px; margin-top: 30px; } #item h3 { color:#5F7993; text-decoration:none; font-size: 30px; } #item:hover, #news-item:hover h3 { color:#ffffff; } #item:hover { background-color: #5F7995; font-family: 'museo500'; color:#ffffff; text-decoration:none; height: 190px; border-color: #5F7995; } #item a { /*This is a button*/ transition: background-color 0.5s ease; background-color: #5F7995; color: #ffffff; text-decoration: none; background: #5F7995 url(../button.png) right bottom no-repeat !important; width: 220px; text-align: left !important; padding: 6px 175px 8px 20px; } #item a:hover { /*This is a button*/ transition: background-color 0.5s ease; background-color: #5F7995; color: #000000; text-decoration: none; background: #ffffff url(../button_hover.png) right bottom no-repeat !important; width: 220px; text-align: left !important; padding: 6px 175px 8px 20px; }
Thanks.
Last edited by penagate; Dec 8th, 2014 at 10:31 PM.
Reason: Added code highlight tags.
-
Dec 8th, 2014, 10:33 PM
#2
Re: How to use transition for multiple div elements?
I'm not exactly sure what you mean by 'automatically hover'.
You've defined a hover state on the item, and a hover state on the anchor within it.
Perhaps you just want to change:
to:
?
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules
|
Click Here to Expand Forum to Full Width
|