CODEWITHSUNDEEP
htmlcss
applewood
applewood

Reputation: 391

Relative and Absolute Position CSS HTML

Trying to make 'tab2' move with the nav bar. (when you hover the nav the box moves out with it) http://jsfiddle.net/Bz5mn/ Help!

   #nav
{
min-width: 60px;
width:5%;
height:100%;
background-color: rgba(1,1,1,0.3);
position: absolute;
top: 0;
left: 0;
transition-duration:0.4s;
overflow: hidden;
}

Upvotes: 0

Views: 54

Answers (1)

LoveAndCoding
LoveAndCoding

Reputation: 7947

Try the adjacent sibling selector. You can do something like

#nav:hover + #tab2 {
    margin-left: 5%;
}

You'd also want to add your transition to the #tab2 declaration so that the animation matches.

Also note that this selector only works in IE 9+

Here's a live demo

Upvotes: 1

Related Questions