infamous Two Div's next to each other

css, facebook, html

Solution

If the parent div `<div class="tab_content tab1">` has more than 810px available in width then the following code should work perfectly fine.

<div class="tab_content tab1">
    <div id="dialerdiv1" style="float: left; width: 405px;">
        <embed ... />
    </div>
    <div id="dialerdiv2" style="float: left; width: 405px;">
        <embed ... />            
    </div>
    <div style="clear: both;"></div>
</div>

Problem

I know there are a lot of questions about this, and I've tried many solutions but I can't get it to work. I have two divs in a facebook canvas page(810px), and I want them to display next to each other. Currently one is on top of the other. Here is my code: ``` <div class="tab_content tab1" > <div id="dialerdiv1" style="float: left; margin-right: 405px;"> <embed type="application/x-shockwave-flash" wmode="opaque" src="thesource" width="301" height="401" id="popUpSwf" name="popUpSwf" quality="high" border="none" allowscriptaccess="always" pluginspage="http://www.adobe.com/go/getflashplayer" scale="noscale" menu="false" flashvars="..." /> </div> <div id="dialerdiv2" style="float: right; width: 405px;"> <embed type="application/x-shockwave-flash" wmode="opaque" src="thesource" width="301" height="401" id="popUpSwf" name="popUpSwf" quality="high" border="none" allowscriptaccess="always" pluginspage="http://www.adobe.com/go/getflashplayer" scale="noscale" menu="false" flashvars="..." /> </div> </div> ``` How do I get those two inside divs next to each other? Also, I tried using a table, and it works, but Firefox shifts those td cells to the outside of the canvas area and I cannot get them centered (only firefox) Thanks

Original source