<TABLE> won't stay within <DIV>

[QatQat]

Hi there,


I have been given an intranet system to modify.

It uses <div> tags to partition various zones in the page. They work pretty well a part from small display differences in internet Explorer 6 or 7.

Anyway I am now having a problem with the main area of the page, enclosed in <div> tags and a table that I need to put in there that won't stay within the defined area.

here is the code:

<!--definition of main area-->
<div id="mainBody" style="position:absolute; left:160; top:30; width:800; height:500; z-index:2; background-color: #dddddd; layer-background-color: #333399; border: 1px none #7b88a9; overflow: auto;"> 



<P>test paragraph</P>




<form action="post.php" method="POST" border="1">
        <table>
         <TR><TD>UserName:</TD><TD><input type="text" Name="uName" size="10"></TD></TR>
         <TR><TD>PassWord:</TD><TD><input type="password" Name="pWord" size="10"></TD></TR>
        </table>
</form>     



<div>

The paragraph I added there in the code stays within the delimited area. The form enclosed in the table will display on the far left of the screen.

Any reason for this?

Another question:
Is it better to code position and dimension of <div> tags in line (like the code above) or in a CSS?


QatQat



--------------------------------------
If I could have sex each time I reboot my server, I would definitely prefer Windoz over Linux!

 

[BillyRayPreachersSon]

Any reason for this?

You probably have some styling we're not aware of, because pasting your exact code into a new document doesn't show that.

To this end, how about posting a URL to the page, or the CSS so we can find out more?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[traingamer]

Your position is incorrectly stated - you need to specify a measurement (px, em %):

<div id="mainBody" style="position: absolute; left: 160[b]px[/b]; top: 30[b]px[/b]; width: 800[b]px[/b]; height: 500[b]px[/b]; z-index: 2; background-color: #dddddd; layer-background-color: #333399; border: 1px solid #7b88a9; overflow: auto;">

Greg
People demand freedom of speech as a compensation for the freedom of thought which they seldom use. Kierkegaard

 

[BillyRayPreachersSon]

Remember that IE lets you get away without that, defaulting to PX...



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[traingamer]

Remember that IE lets you get away without that, defaulting to PX...

It didn't default for me (in IE6 with a valid doctype). (Although we're not exactly working with the full html here, so we may not be getting the complete picture. With just this snippet, the table was always inside the div).

Greg
People demand freedom of speech as a compensation for the freedom of thought which they seldom use. Kierkegaard