Honesty Rocks! truth rules.

Css Table Scaling

HOME      >>       Programming

it01y2

I am currently new to css and html, i need to scale the table and pictures so it is 100% of the window width. Here's the code:

<table border="0" width="100%" id="table1" cellspacing="0" cellpadding="0"> <tr> <td width="01%"> <img border="0" src="sdmenu/LEFTBOTTOM.GIF" width="10" height="25"></td> <td width="481" style background="sdmenu/main2.GIF"> <p align="right"><b><font size="1" face="Arial"> | <a target="rtop1" href="mainframe.htm">Home</a> | <a target="rtop1" href="gallery.htm">Gallery</a> | <a target="rtop1" href="aboutus.htm">About Us</a> | <a target="rtop1" href="contactus.htm">Contact Us</a> |</font></b></td> <td width="317" style background="sdmenu/main2.GIF"> <p align="right"><font style="font-size: 8pt"> <font face="Times New Roman">Š </font>Rockin and rollin 2007</font></td> <td width="1%"><img border="0" src="sdmenu/RIGHTBOTTOM.GIF" width="10" height="25"></td> </tr></table>

I have uploaded it onto this website for testing http://forums.xisto.com/no_longer_exists/

Any ideas?

sonesay

the margins and padding are left on by default causing the spaces. these values are different for each type of browser so setting it to always to 0 is best practice and then assigning any margins or paddings for other elements as needed

<body margin='0' padding='0'>

that code should do it. Your also not using css its just html code by the way. Best way to format and style your webpage is using CSS.w3schools.com is a great site to start out learning.good luck.


it01y2

added that code didnt work?


sonesay

I thought that would of worked but it didnt sorry.add this it worked for me I just tried it out now.

<html><head><meta http-equiv="Content-Language" content="en-gb"><meta http-equiv="Content-Type" content="text/html; charset=windows-1252"><title>New Page 2</title><style>body{margin: 0px;padding 0px;}</style>


jlhaslip

Width of 100% on the table will cause the table to be 100% of the *container* it resides in.And some Browsers handle width to be only as wide as the content contained inside it.We would need a link to the page or a posting of the entire page to assist further.


it01y2

np thanks for the help anyway, it works now, here's the code:

<body><table border="0" width="100%" id="table1" cellspacing="0" cellpadding="0"> <tr> <td style="size:auto;"> <img border="0" src="sdmenu/LEFTBOTTOM.GIF" width="10" height="25"></td> <td width="60%" style background="sdmenu/main2.GIF" style="background-repeat:repeat-x;"> <p align="right"><b><font size="1" face="Arial"> | <a target="rtop1" href="mainframe.htm">Home</a> | <a target="rtop1" href="gallery.htm">Gallery</a> | <a target="rtop1" href="aboutus.htm">About Us</a> | <a target="rtop1" href="contactus.htm">Contact Us</a> |</font></b></td> <td width="40%" style background="sdmenu/main2.GIF"> <p align="right"><font style="font-size: 8pt"> <font face="Times New Roman">Š </font>Rockin and rollin 2007</font></td> <td width="1%"><img border="0" src="sdmenu/RIGHTBOTTOM.GIF" width="10" height="25"></td> </tr></table></body>