I cannot get two iframes to sit side-by-side. Nor in the dimentions I want them in.

[Screaming Eagle]

I haven't recieved any information that I could use, and researching this issue hasn't turned up any worthy results. Hence my reposting. Since I have had no reply, and my associates wish to move things along, I have been forced to use regular frames for the site (which works fine, but visually its not what I'd like to produce). Ideally, I would like to fix this problem I currently have with iframes, and do without using regular frames. If anyone needs more information, don't hesitate to ask.

Here is my original text:

Ok, so some associates and I are building a website, and I'm in charge of the design and layout. I've decided to go with a simple navigation bar on top contained in its own div. Under the navigation bar, I have two iframes contained in one div and each iframe in its own inside the container div. In theory it was supposed to have shown the user statistics to the left at a width of 160 pixels and lowered from the top at 73 pixels. That displays fine.

Where everything falls apart is when the second iframe: "iframemain " (which should show up right next to the first) appears beneaththe user statistics iframe, and at the same dimentions as the user statistics iframe; I simply want it to take up the rest of the screen with my "iframemain ".

This problem seems to happen on both IE6 and Firefox

I have tried not having a container div around both; I've removed the html height/width elements that I had previously placed in the body of the code; I've played around with height and width in the CSS coding as well; I taken away absolute postions, and as you can see, I've made the user div inline. I'm pretty much stumped as to what I'm missing here. Can anyone give me a pointer?

This is my CSS code:


[

]
body {font-size:8pt}
 
hr  {color:black}
 
p.img {font:8pt; color:black}
 
a.reg:link,a.reg:visited,a.reg:active       {font:6pt; color:black; text-decoration:none}
a.reg:hover     {font:6pt; color:black; text-decoration:underline}
 
th,tr,td   {color:black; font-size:8pt}
 
table.one   {table-layout:auto; border-collapse:separate;
    empty-cells:show; border-color:white;
    border-style:none; padding:0; margin:0}
 
div.main {float:left; border:1px; overflow:hidden;
    left:0px; top:0px; padding:0; margin:0}
 
div.wb1 {float:left; background-color:white; 
    width:325px; height:390px; z-index:0}
 
div.background  {float:left; left:0px; top:0px;
    padding:0; z-index:-1}
 
div.nav {float:left; height:70px; border:1px; border:solid; 
    border:black; left:1px; top:1px; padding:0}
 
div.contain {float:left; width:100%; padding:0; margin:0}    
 
div.user {float:left; width:160px; 
    border:1px; border:solid; border:black;
    left:1px; top:73px; padding:0; display:inline}
 
div.iframemain {float:left; top:73px; left:163px;
    padding:0}
 
img.background1  {left:0px; top:0px; z-index:-1}
 
img.background2 {margin-left:20%}
 
[

]
This is my xhtml code:


[

]
<div class="nav">
      <!-- THE NAVBAR!-->
      <table class="one" style="margin-left:350px" cellpadding="5">
        <tr>
          <td><a class="reg" href="nav1.htm" target="actframe">Nav choice1</a></td>
          <td><a class="reg" href="area.htm" target="actframe">Nav choice2</a></td>
          <td><a class="reg" href="nav2.htm" target="actframe">Nav choice3</a></td>
          <td><a class="reg" href="nav3.htm" target="actframe">Nav choice4</a></td>
          <td><a class="reg" href="nav4.htm" target="actframe">Nav choice5</a></td>
          <td><a class="reg" href="nav5.htm" target="actframe">Nav choice6</a></td>
        </tr>
        <tr>
          <td><a class="reg" href="nav6.php" target="actframe">Nav choice6</a></td>
          <td><a class="reg" href="nav7.htm" target="actframe">Nav choicel8</a></td>
          <td><a class="reg" href="nav8.htm" target="actframe">Nav choice9</a></td>
          <td><a class="reg" href="http://www.mywebsite.net/forums/" target="_blank">Forums</a></td>
          <td><a class="reg" href="bugreport.htm" target="actframe">Bug Report</a></td>
          <?php
 
          if($usertype == "Admin")
          {
          echo "<td><a class=\"reg\" href=\"admin.php\" target=\"actframe\">Admin</a></td>";
          }
 
          ?>
        </tr>
      </table>
    </div>
 
    <div class="contain">
 
      <div class="user">
        <!--this contains a separate page on the left of the screen for user statistics-->
        <iframe src="user.php" name="showframe" frameborder="0" />
      </div>
 
      <div class="iframemain">
        <!--this is where the user should see all of the links appear when clicked-->
        <iframe src="area.htm" name="actframe" frameborder="0" />
      </div>
 
 
    </div>
 
  </body>
 
  <frameset>
    <frame src="area.htm" name="actframe"/>
  </frameset>
[

]