Okay, so I'm coming to terms with transitions but not so with div and naming them. I have the code;
<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:40px;
height:60px;
opacity:0.4;
background:black;
transition:all 2s;
-moz-transition:all 2s; /* Firefox 4 */
-webkit-transition:all 2s; /* Safari and Chrome */
-o-transition:all 2s; /* Opera */
}
div:hover
{
width:90px;
opacity:0.9;
}
</style>
</head>
<body>
<br>
<center><u><b>TEST</center></b></u></center>
<div></div>
</body>
</html>
On a layout this just completely messes every thing about it. Everything else has the transition basically and messes the positioning of stuff up.
I'm thinking the problem is that the 'div' is getting mixed with the rest of the layout, if it is this how would I name the 'div' so that it is single and doesn't change the rest of the layout. Thanks.