Question

Im having trouble with embedded flash messing up inline blocks. There are 3 divs in a horizonal row, but as soon as I put this flash object in the 1st one, the other 2 drop about 15px. The first div stays where its supposed to, but I can’t work out whats happening with the other 2. Im using ‘objecty’ to embed but had the same+more problems with other codes, reducing the width and height of the object also has no effect. Any help would be greatly appreciated.
cheers,

#nb_designblankleft_portfolio
{
border: 0;
margin: 0;
padding: 0;
width: 200px;
height: 40px;
display: inline-block;
text-align: center;
line-height: 40px;
background-color: #ffffff;
background-image: url("media/buttons/bwbrs.gif");
font-family: Arial;
color: rgb(0, 0, 0);
font-weight: bold;
font-size: 13pt;
zoom: 1;
*display: inline;
_height: 40px;

}

Answer 1

Apparently, all you were missing was a simple float attribute that is a must when div’s are used as columns.

#nb_designblankleft_portfolio {
    border: 0;
    margin: 0;
    padding: 0;
    width: 200px;
    display: inline-block;
    text-align: center;
    height: 40px;
    line-height: 40px;
    background-color: white;
    background-image: url("media/buttons/bwbrs.gif");
    font-family: Arial;
    color: black;
    font-weight: bold;
    font-size: 13pt;
    zoom: 1;
    _height: 40px;
    float: left;    //add this exact line to #nb_designportfolio_portfolio and #nb_designblankright_portfolio
 }