| News | |
 |
Latest |
|
Archive |
|
Community news |
| Articles | |
|
C++ |
|
Communities and Content |
|
Databases |
|
Editorials |
|
Emacs |
|
General |
|
HTML |
|
Java |
|
Notices |
|
PHP |
|
XML |
| Links | |
|
Apache |
|
C++ |
|
Database |
|
General |
|
HTML |
|
Java |
|
Javascript |
|
Linux |
|
Object oriented programming |
|
Open source |
|
Perl |
|
PHP |
|
Python |
|
Ruby |
|
SOAP |
|
XML |
|
Suggest a link |
| About | |
|
Advertise on zez |
|
Contribute |
|
Contact us |
|
About zez |
S-t-r-e-t-c-h-i-n-g your HTML |
Height
The total height of the "box" in the example depends on the width and the amount of content in the center cell. The height could also be set in % in the table tag to make it stretch to fit the browser window vertically, but we won't do that in this example (but do try it yourself).The height of the cells in the top and bottom rows are controlled by the style attribute. The reason for doing this is that some new browsers (especially Netscape 6.0) might leave vertical gaps if the cells are not forced to wrap arount the content like this. This trick sets the font-size to 1 pixel, and this makes the cells tighten up even if they don't contain any fonts. (Usually I would set this style attribute by an external CSS style sheet, but in this example the style is defined inline to keep it simple.)
Download
The example in this tutorial has been tested (and should work properly) in Internet Explorer 5.5, Opera 5.0, and Netscape 4.76 and 6.0 on Windows, and in Konqueror 2.2, Netscape 4.76, Mozilla M18 on Linux. Feel free to tweak the code, but remember to test it yourself on all browsers where you want to be sure it works.Attached files:
Comment List
| Topic: | Author: | Time: |
|---|---|---|
| Thank you | Eleonora Slipchenko | 03.12.2001 21:01 |
|
I have spent so much time trying to build the perfect template using borders. I couldn't find a tutorial anywhere. You have simplified a lot for me. Now I can redesign my template and apply it properly with this code.
|
||
| Great Article | Kalos Jones | 13.11.2001 21:05 |
|
This is a great article. I was wondering how to create a table with images as the border. Thanks for such a great help. |
||
| Great article on a tricky subject | Chris Mason | 20.06.2001 15:13 |
|
I've spent hours getting this right on many sites, this article explains it clearly.
|
||
