Take a look at the example I created on http://jsfiddle.net/GKnkW/2/
Here's the HTML code:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<div class="step">1</div>
<div class="step">2</div>
<br/><br/>
<div class="step1">3</div>
<div class="step1">4</div>
</body>
</html>
CSS code:
.step
{
height:150px;
width:150px;
background:yellow;
display:inline;
}
.step1
{
height:150px;
width:150px;
background:yellow;
}
I'm facing an issue where adding the `display:inline` property to the CSS seems to make the divs (#1 and #2) lose their height and width settings. Any ideas on how to fix this strange behavior?