473,847 Members | 1,505 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Problems with tables and layout in Firefox

Hi all,

I am having some trouble with some table code. It works fine in Internet
Explorer, but the layout doesn't work correctly in Firefox 1.0.7

Is this a firefox bug, or am I missing something in the HTML? It is pretty
simple code! (Plus it is valid according to the w3c validator)

The layout problem is in the third row. I cannot get the embedded table
(with the top and bottom cells) to be the full height of the cell (unless
I take out the second row). The HTML in the third row is identical to the
HTML in the first row.

I have attached the code below.

Cheers,

Ben

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test Page</title>
</head>
<body>
<form action="">
<table border="1">
<!-- This row is fine -->
<tr>
<td style="height: 100%">
<table border="1" style="height: 100%; width: 100%;">
<tr>
<td style="vertical-align: top; ">top</td>
</tr>
<tr>
<td style="vertical-align: bottom; ">bottom</td>
</tr>
</table>
</td>
<td><textarea rows="5" cols="10"></textarea></td>
</tr>

<!-- If this row is removed, then the next row works fine!!! -->
<tr>
<td>hmmm</td>
<td>what's going on???</td>
</tr>

<!-- This row is identical to the first, but the embedded table is not 100% height -->
<tr>
<td style="height: 100%">
<!-- This is the table that won't behave in Firefox!! -->
<table border="1" style="height: 100%; width: 100%">
<tr>
<td style="vertical-align: top;">top</td>
</tr>
<tr>
<td style="vertical-align: bottom;">bottom </td>
</tr>
</table>
</td>
<td><textarea rows="5" cols="10"></textarea></td>
</tr>

</table>
</form>
</body></html>

Jan 4 '06 #1
11 12331
> I am having some trouble with some table code. It works fine in Internet
Explorer, but the layout doesn't work correctly in Firefox 1.0.7


Update: I have upgraded to Firefox 1.5 and it still doesn't work.

Can anyone else confirm that the display is incorrect on their system on
Firefox (or any other browser for that matter)?

Cheers,

Ben
Jan 7 '06 #2

On Sat, 7 Jan 2006, Ben Holness wrote:
I am having some trouble with some table code. It works fine in Internet
Explorer, but the layout doesn't work correctly in Firefox 1.0.7


Update: I have upgraded to Firefox 1.5 and it still doesn't work.


Post the URL of your test document on a suitable server.

The reasons have been explained often enough.
Jan 7 '06 #3
> Post the URL of your test document on a suitable server.

Sorry, should have realised!

I have put it up at http://usenet.hostiz.com/

Feedback appreciated!

Cheers,

Ben
Jan 9 '06 #4
Ben Holiness wrote:

I have put it up at http://usenet.hostiz.com/

Is the "There is no website configured at this address" the actual page
we are meant to see?
Also, what does "the layout doesn't work correctly in Firefox" mean
(since I am too lazy to boot to Windows to run IE)?

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Jan 9 '06 #5
Ben Holness wrote:
Can anyone else confirm that the display is incorrect on their system on
Firefox (or any other browser for that matter)?


It displays incorrectly on my system:
Windows XP
Firefox 1.5

I'm having a think about why it's not working

Dan

Jan 9 '06 #6
Jim Moe wrote:
Ben Holiness wrote:
I have put it up at http://usenet.hostiz.com/


Is the "There is no website configured at this address" the actual page
we are meant to see?
Also, what does "the layout doesn't work correctly in Firefox" mean
(since I am too lazy to boot to Windows to run IE)?


I took the liberty of uploading it to my site:

http://www.danrumney.co.uk/benHolnessBug.html

Dan
Jan 10 '06 #7
Dan Rumney wrote:
Ben Holness wrote:
Can anyone else confirm that the display is incorrect on their system on
Firefox (or any other browser for that matter)?

I do not have an answer about what is happening, or which browsers are
correct, if any, about rendering.
IE6: does not expand to 100%
Opera7: does not expand to 100%
Firefox1.0.7: first row expands
There is something odd about using percentage to set the height of
elements contained in a table cell. Firefox obviously does it inconsistently.

Using non-relative units like px or em eliminates the problem.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Jan 10 '06 #8
On Tue, 10 Jan 2006 00:02:12 +0000, Dan Rumney wrote:
Jim Moe wrote:
Ben Holiness wrote:
I have put it up at http://usenet.hostiz.com/

Is the "There is no website configured at this address" the actual
page we are meant to see?
No it's not - Hostiz say that they are upgrading their servers and no
accounts will be lost, but I guess mine is an exception!

I took the liberty of uploading it to my site:

http://www.danrumney.co.uk/benHolnessBug.html


Thanks Dan - much appreciated :)
Also, what does "the layout doesn't work correctly in Firefox" mean
(since I am too lazy to boot to Windows to run IE)?


The code for both the first and last rows of the table are the same. The
layout is supposed to align such the the word "top" is at the top of the
(outer) table cell and "bottom" is at the bottom. In the actual
application I am working on, the tables have no border and the "top" is
the label for the textarea, while the "bottom" is a character count. In
the actual application the height of the textarea is variable, but I
always want the character count to align to the bottom of the textarea.

Cheers,

Ben

Jan 10 '06 #9
On Tue, 10 Jan 2006 11:39:06 +0000, Ben Holness <us****@bens-house.org.uk>
wrote:

|On Tue, 10 Jan 2006 00:02:12 +0000, Dan Rumney wrote:

|The code for both the first and last rows of the table are the same. The
|layout is supposed to align such the the word "top" is at the top of the
|(outer) table cell and "bottom" is at the bottom. In the actual
|application I am working on, the tables have no border and the "top" is
|the label for the textarea, while the "bottom" is a character count. In
|the actual application the height of the textarea is variable, but I
|always want the character count to align to the bottom of the textarea.
|
|Cheers,
|
|Ben
|
The second nested table is missing a semi colon after width :100%
Jan 20 '06 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

44
3912
by: Mariusz Jedrzejewski | last post by:
Hi, I'll be very grateful if somebody can explain me why my Opera 7.23 (runing under linux) doesn't show me inner tables. Using below code I can see only "inner table 1". There is no problem with other browsers (I checked it under Konqueror). Thank you in advance for your help. Regards. /Mariusz <HTML>
39
5700
by: Zak McGregor | last post by:
Hi all Are there any good solutions to aligning form field names and input boxes without resorting to tables? I am struggling to do this nicely at the moment. Thanks Ciao Zak
2
2612
by: CJM | last post by:
I'm developing a site for a charity which I am aiming to make standards-compliant, accessible and cross-browser compatible. I'm doing OK so far and have the workings of a respectable site, but I still have a few little niggly problems: Site: http://www.aif-advocacy.org.uk/index.asp CSS: http://www.aif-advocacy.org.uk/aif.css
1
2201
by: NightWalker | last post by:
Hello all: I'm having a problem correctly rendering a web page that uses layers to display a web form on top of a flash object. The problem is that the layer renders correctly but the scroll bar for the layer does not, it hides behind the flash object, this only happens aparently in Mac Firefox, Mac IE doesn't display this behaviour nor does Safari.
4
1709
by: viral612 | last post by:
i m trying to see the xml in a browser using an xslt.... My xml i have defined as <?xml version=" 1.0" encoding="ISO-8859-1"?> <?xml-stylesheet type="text/xsl" href="Topic_publications_xsl.xsl"?> <!DOCTYPE root > <root> &about;
2
2293
by: TheHobbit | last post by:
Hi there I am a real newbie to CSS so please excuse any daft questions! I am trying to create a page with a header that contains a small square logo in top left corner with 2 longer divs to the rigt side of this extending across the top of the page, one above the other but not extending below the bottom of the logo. Hope that makes sense. Problem is: Displays fine in Safari (I am using a Mac) but the layout is a real mess in Firefox. Not...
10
2655
by: Shawn Northrop | last post by:
Hey everybody. I am trying to convert a website that was built using tables into one with using div tags. Not as easy as i thought. Heres the site http://www.jeanneflight.com/JF -- CSS layout http://www.jeanneflight.com/JF/tables -- table layout My problems relating to first link: 1 Internet explorer crashes 2 The background image for the second div does show up 3 Alignment: The First Div contains 3 images. In the css file I needed to...
4
3256
by: lesterhawkins | last post by:
When I create an html web page with tables, the space between the tables is correct when I look at the web page in Firefox, but incorrect when I look at the web page in IE. I have put an example of this in: http://www.doug-long.com/atest.htm . The third paragraph is in its correct position in Firefox but is pushed off to the side in IE. How can I code so the tables are the same distance apart in both Firefox and IE? (I have Firefox...
3
1723
by: Rachel Lynn | last post by:
I'm working on the index page of a site and can get the tables to view properly in Safari, but have a gap in both Explorer and Firefox . The page is here: http://ludussports.com/index-test.html I believe the problem is with the golf image (golf1.jpg) spanning two rows and two columns. I went back and specified the column widths and double checked the table width....any ideas? Thanks in advance! Rachel
0
10653
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
10718
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
9490
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7888
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
7061
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5915
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4540
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
2
4129
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
3168
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.