Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Absolute positioning inside table, IE vs firefox

    Hi,

    I am trying some html/css and using absolute positioning inside a table. The same code is shown differently in IE and Firefox. I have not idea why this happening. Below is the code.

    Code:
    <!DOCTYPE document PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <document xmlns="http://www.w3.org/1999/xhtml">
    <html>
    <head>
    </head>
    <body lang="EN-US" link="blue" vlink="purple">
    	<table class="normal" cellspacing="0.00px" style="border-collapse:collapse;position:absolute;top:121px;left:48px;">
    		<tr>
    			<td width="250.000px" height="200.000px">
    				<p class="normal" ><span class="f1" style="position:absolute;top:130px;left:48px;">Name</span></p>
    				<p class="normal" ><span class="f1" style="position:absolute;top:145px;left:48px;">Surname</span></p>
    				<p class="normal" ><span class="f1" style="visibility:hidden;">hidden</span></p>
    				<p class="normal" ><span class="f1" style="position:absolute;top:176px;left:48px;">Your Account Number: </span><span class="f1" style="position:absolute;top:176px;left:187px;">258457891</span></p>
    			</td>
    			<td width="470.400" height="200.000px" style=" padding-top:0.00px; padding-right:0.00px; padding-bottom:0.00px; padding-left:19.60px; ;;border-left:1.00px solid #000000;" >
    				<p class="normal" ><span class="f10"  style="line-height:1.50px;position:absolute;top:247px;left:307px;">Less</span><span class="f3"  style="line-height:1.50px;position:absolute;top:247px;left:355px;">Payments made through </span><span class="f3"  style="line-height:1.50px;position:absolute;top:247px;left:532px;">, thank you</span><span class="f3"  style="line-height:1.50px;position:absolute;top:247px;left:708px;">-$52.36</span></p>
    			</td>
    		</tr>
    	</table>
    </body>
    </html>
    I am new to html so may be don't know the internals how different browser's render this. May be some expert point me to correct direction.

    Thanks.

  • #2
    Regular Coder
    Join Date
    Aug 2011
    Location
    U.S.A.
    Posts
    233
    Thanks
    2
    Thanked 48 Times in 48 Posts
    Your biggest issue is trying to use absolute positioning while inside a table. This is going to cause you lots of problems. My question to you is why do you need to use tables at all? I looks like the same thing can be accomplished better with a couple of divs.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •