Geek asks and answers

Notorious two divisions next to each other

I know that there are a lot of questions, and I have tried many solutions, but I cannot get it to work. I have two divs on my facebook canvas page (810px) and I want them to appear 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 these two inside divs next to each other? In addition, I tried to use the table, and it works, but Firefox shifts these td cells outside the canvas area, and I cannot center them (firefox only)

thank

+5
source share
3 answers

If the parent div <div class="tab_content tab1">is wider than 810 pixels wide, then the following code should work 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>
+5
source

div, .

<div id="dialerdiv2" style="float: right; width: 370px;">


         <div id="dialerdiv1" style="float: left; margin-right: 390px;">
            ......
         </div>
         <div id="dialerdiv2" style="float: right; width: 390px;">
            ........
         </div>

. , ,

+2

Have the body margins and padding been removed?

body{margin:0;padding:0}
0
source

More articles: