I'm going a bit nuts here. Can anyone explain how Opera 6.0.4 decides to lay out the columns of tables? It seems to want to expand the columns I least want and is totally different from all other browsers I am testing on (NS 4.7, 6, 7, IE 4, 5, 6).<br />
<br />
e.g. The following table in Opera expands the first column (label 1) to fill all the blank space. Other browsers space it evenly.<br />
<br />
<table width="100%"><br />
<tr><br />
<th>label 1</th><br />
<td><input type="text" size="10" name="blah"/></td><br />
<td> </td><br />
<th>label 2</th><br />
<td><input type="text"size="10" name="blah2"/></td><br />
</tr><br />
</table><br />
<br />
<br />
In another table, which has links in each cell except one, it spaces the linked cells evenly and squashes the non-link cell.<br />
<br />
Is there any way to get Opera to space things the way you want them to?<!--content-->Try a spacer gif??<br />
<br />
MNS<!--content-->From the HTML 4.01 Specification:<br />
Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.<br />
<!-- m --><a class="postlink" href="http://www.w3.org/TR/html4/struct/tables.html#h-11.1Moreover">http://www.w3.org/TR/html4/struct/table ... .1Moreover</a><!-- m -->, you need to make use of the LABEL (<!-- m --><a class="postlink" href="http://www.w3.org/TR/html4/interact/forms.html#edef-LABEL">http://www.w3.org/TR/html4/interact/for ... edef-LABEL</a><!-- m -->) element.<!--content-->Thanks, MNS, but no images are allowed on my website.<br />
<br />
<sigh> I was so tempted to say "and YES I am setting out lots of tabular data!!!!" on the original post 'cause I knew someone would decide to tell me off instead of trying to answer the question. I really should have put it in.<br />
<br />
Most of the website I'm developing is for tabular data. Lots and lots of data. The other part is for input forms to add the data. I need this to work on old browsers as well as new and CSS-P doesn't really work on NS4.7.<br />
<br />
So, back to my original question, how does the Opera rendering engine decide to lay out its tables? Is the label tag going to make it lay things out nicely?<!--content-->And I go back to my original answer, mark up the page properly.<br />
<br />
1) Start with a page properly marked up in HTML 4.01 Strict. Use the TABLE element only for tabular data. At this point your page will be a bit drab but it will work on all browsers.<br />
<br />
2) Add presentation using CSS. The page will work on browsers that do not understand CSS because you have carefully followed 1 above. Browsers the understand CSS1 and not CSS2 present a small challenge. Start with a CSS1 style sheet and make use of the @import rule to hide things from those browsers. The idea is that you end up with three pages from one.<!--content-->Originally posted by careyf <br />
I need this to work on old browsers as well as new and CSS-P doesn't really work on NS4.7<br />
Seems to me you misundersand what working site is...<!--content-->Seems to me you misundersand what working site is... <br />
<br />
I personally understand the difference, but can you explain to my bosses & my users why things look really bad on what is a comparably new browser?<br />
<br />
1) Start with a page properly marked up in HTML 4.01 Strict. Use the TABLE element only for tabular data. At this point your page will be a bit drab but it will work on all browsers. <br />
<br />
This isn't true actually. The table problem also happens when you are laying out strictly tabular data on Opera 6.04... first column is far left and fills up all the padding, and the other columns get thrown to the far right and squashed up. <br />
<br />
2) Add presentation using CSS. The page will work on browsers that do not understand CSS because you have carefully followed 1 above. Browsers the understand CSS1 and not CSS2 present a small challenge. Start with a CSS1 style sheet and make use of the @import rule to hide things from those browsers. The idea is that you end up with three pages from one. <br />
<br />
I am using CSS for presentation, but compromising and using tables as well (HTML 4.0.1 transitional). <br />
<br />
Anyway, I've noticed in many posts and not just this one, that people respond to table questions simply with 'use CSS'. Can we please give examples of what would work across all browsers instead of just preaching? This would help all us CSS-challenged people.<!--content-->People are not CSS chalenged, browsers are. Especially the latest piece o work from M$. IE 6.<br />
<br />
Making a site work cross browser in css without using a javascript sniffer and serving up a stylesheet that a particular browser will not choke on seems to be the only way.<br />
<br />
I have a business site. I only do html 4.01 transitional and use deprecated tags etc(no tables for layout thoug. because it works in all browsers without the use of javascript. I cannot afford to have someonee come to my site and go away without seeing it because CSS support in their browser is horrible, and yes I mean IE, any version or platform you pick. <br />
<br />
NN6x+, Mozilla and the latest in Opera, Safari and Konqueror good luck making something that will work in all of them and not be extremely simple.<br />
<br />
Until browser support gets better, or there is a mass exodus from the use of IE, you really have a hard time making a site in CSS cross browser. HTML 401 transitional is VALID coding and can work in IE 3x to IE 6, NN4 to NN7...go for it for now.<br />
<br />
MNS<!--content-->IE isn't all that bad. Particularly if you use basic css.<!--content-->Oh.... just found out something... Opera 6 doesn't support the LABEL tag.<!--content-->Originally posted by careyf <br />
Oh.... just found out something... Opera 6 doesn't support the LABEL tag. 1)The LABEL element is there for non-visual user agents, to associate the label with the form element. This is especially important if you insist on breaking the rules and employ TABLE elements for layout.<br />
<br />
2) Opera 7 recognizes it just fine.<!--content-->I think it's rather silly to need to justify everything. I need to break the rules so I would like some help.<br />
<br />
There is no requirement for my project to provide for the visually impaired. There IS a requirement for speed, cross-browser compatability & to serve up tabular data while still adhering to set GUI guidelines. All of this against a tight deadline. <br />
<br />
If someone could provide me an example of exactly how to build a form like this (but with more rows) that doesn't use tables but will still work across all my browsers without the use of a sniffer or a CSS per browser, I would be very very happy to use it. In the meantime HTML Transitional will have to do.<!--content-->
<br />
e.g. The following table in Opera expands the first column (label 1) to fill all the blank space. Other browsers space it evenly.<br />
<br />
<table width="100%"><br />
<tr><br />
<th>label 1</th><br />
<td><input type="text" size="10" name="blah"/></td><br />
<td> </td><br />
<th>label 2</th><br />
<td><input type="text"size="10" name="blah2"/></td><br />
</tr><br />
</table><br />
<br />
<br />
In another table, which has links in each cell except one, it spaces the linked cells evenly and squashes the non-link cell.<br />
<br />
Is there any way to get Opera to space things the way you want them to?<!--content-->Try a spacer gif??<br />
<br />
MNS<!--content-->From the HTML 4.01 Specification:<br />
Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.<br />
<!-- m --><a class="postlink" href="http://www.w3.org/TR/html4/struct/tables.html#h-11.1Moreover">http://www.w3.org/TR/html4/struct/table ... .1Moreover</a><!-- m -->, you need to make use of the LABEL (<!-- m --><a class="postlink" href="http://www.w3.org/TR/html4/interact/forms.html#edef-LABEL">http://www.w3.org/TR/html4/interact/for ... edef-LABEL</a><!-- m -->) element.<!--content-->Thanks, MNS, but no images are allowed on my website.<br />
<br />
<sigh> I was so tempted to say "and YES I am setting out lots of tabular data!!!!" on the original post 'cause I knew someone would decide to tell me off instead of trying to answer the question. I really should have put it in.<br />
<br />
Most of the website I'm developing is for tabular data. Lots and lots of data. The other part is for input forms to add the data. I need this to work on old browsers as well as new and CSS-P doesn't really work on NS4.7.<br />
<br />
So, back to my original question, how does the Opera rendering engine decide to lay out its tables? Is the label tag going to make it lay things out nicely?<!--content-->And I go back to my original answer, mark up the page properly.<br />
<br />
1) Start with a page properly marked up in HTML 4.01 Strict. Use the TABLE element only for tabular data. At this point your page will be a bit drab but it will work on all browsers.<br />
<br />
2) Add presentation using CSS. The page will work on browsers that do not understand CSS because you have carefully followed 1 above. Browsers the understand CSS1 and not CSS2 present a small challenge. Start with a CSS1 style sheet and make use of the @import rule to hide things from those browsers. The idea is that you end up with three pages from one.<!--content-->Originally posted by careyf <br />
I need this to work on old browsers as well as new and CSS-P doesn't really work on NS4.7<br />
Seems to me you misundersand what working site is...<!--content-->Seems to me you misundersand what working site is... <br />
<br />
I personally understand the difference, but can you explain to my bosses & my users why things look really bad on what is a comparably new browser?<br />
<br />
1) Start with a page properly marked up in HTML 4.01 Strict. Use the TABLE element only for tabular data. At this point your page will be a bit drab but it will work on all browsers. <br />
<br />
This isn't true actually. The table problem also happens when you are laying out strictly tabular data on Opera 6.04... first column is far left and fills up all the padding, and the other columns get thrown to the far right and squashed up. <br />
<br />
2) Add presentation using CSS. The page will work on browsers that do not understand CSS because you have carefully followed 1 above. Browsers the understand CSS1 and not CSS2 present a small challenge. Start with a CSS1 style sheet and make use of the @import rule to hide things from those browsers. The idea is that you end up with three pages from one. <br />
<br />
I am using CSS for presentation, but compromising and using tables as well (HTML 4.0.1 transitional). <br />
<br />
Anyway, I've noticed in many posts and not just this one, that people respond to table questions simply with 'use CSS'. Can we please give examples of what would work across all browsers instead of just preaching? This would help all us CSS-challenged people.<!--content-->People are not CSS chalenged, browsers are. Especially the latest piece o work from M$. IE 6.<br />
<br />
Making a site work cross browser in css without using a javascript sniffer and serving up a stylesheet that a particular browser will not choke on seems to be the only way.<br />
<br />
I have a business site. I only do html 4.01 transitional and use deprecated tags etc(no tables for layout thoug. because it works in all browsers without the use of javascript. I cannot afford to have someonee come to my site and go away without seeing it because CSS support in their browser is horrible, and yes I mean IE, any version or platform you pick. <br />
<br />
NN6x+, Mozilla and the latest in Opera, Safari and Konqueror good luck making something that will work in all of them and not be extremely simple.<br />
<br />
Until browser support gets better, or there is a mass exodus from the use of IE, you really have a hard time making a site in CSS cross browser. HTML 401 transitional is VALID coding and can work in IE 3x to IE 6, NN4 to NN7...go for it for now.<br />
<br />
MNS<!--content-->IE isn't all that bad. Particularly if you use basic css.<!--content-->Oh.... just found out something... Opera 6 doesn't support the LABEL tag.<!--content-->Originally posted by careyf <br />
Oh.... just found out something... Opera 6 doesn't support the LABEL tag. 1)The LABEL element is there for non-visual user agents, to associate the label with the form element. This is especially important if you insist on breaking the rules and employ TABLE elements for layout.<br />
<br />
2) Opera 7 recognizes it just fine.<!--content-->I think it's rather silly to need to justify everything. I need to break the rules so I would like some help.<br />
<br />
There is no requirement for my project to provide for the visually impaired. There IS a requirement for speed, cross-browser compatability & to serve up tabular data while still adhering to set GUI guidelines. All of this against a tight deadline. <br />
<br />
If someone could provide me an example of exactly how to build a form like this (but with more rows) that doesn't use tables but will still work across all my browsers without the use of a sniffer or a CSS per browser, I would be very very happy to use it. In the meantime HTML Transitional will have to do.<!--content-->