Tables reaching Top and Bottom

N2PGames

New Member
Messages
470
Reaction score
0
Points
0
Over the years i was never able to make a html version of a website thats why i never made any of my PSD Images into a usable theme but now i have learned that all it takes is tables :D but i want to make the top of the webiste and the footer of the website reach the top and bottom of the website

heres a easer way to explain what i want

helpinfox10ts7.png


is their any simple codes for this?

thnx.
 
Last edited:

Zenax

Active Member
Messages
1,377
Reaction score
4
Points
38
There aint any diffence in those pictures! well as far as I can tell there aint!

And to create the code, you simple, have to slice the image up into the relevant parts, and then code it so that they sit as the background image of the cell, or as the image contained within the cell.

Regards,
Zenax
 
Last edited:

N2PGames

New Member
Messages
470
Reaction score
0
Points
0
the one on the left has spaces on the top and bottom... and the one of the right forces the website top abd bottom to reach the top/bottom of the browser no matter how big or small it is

i know how to code it now :D but i want the header and footer to be resized by the users resolution

if the website was designed on for ex 800x600 a user on 1600x1200 will have the websites footer/ body reach the end of the browser if you view the game by right click > view image

you'll see what i mean :D
 

Zenax

Active Member
Messages
1,377
Reaction score
4
Points
38
if you want it to fit the users resolution, then you have to code it so the widths are done in percentages. That way when ever you resize the width is set to that percentage of the screen.

15% = 15% on all screen resolutions.

Regards
Zenax
 

Chris Z

Active Member
Messages
5,603
Reaction score
0
Points
36
yup, Zenax is right, so if you want to do table width's in percentages or w/e, you'd do
HTML:
<table style="width:15%;">
you can also use this on <tr>'s and <td>'s
 
Last edited:

t2t2t

New Member
Messages
690
Reaction score
0
Points
0
yup, Zenax is right, so if you want to do table width's in percentages or w/e, you'd do
HTML:
<table style="width:15%;">
you can also use this on <tr>'s and <td>'s

only good idea to use height(because he is talking about height) for table, is if you have only one free-height row:

HTML:
<table style="height:100%; width:400 px;">
<tr style="height:200px;">
<td>Header</td>
</tr>
<tr> <!-- Free height, will be [height of window] - [fixed heights] -->
<td>Content</td>
</tr>
<tr style="height: 100px;">
<td>Footer</td>
</tr>
</table>
This should work... (Not guaranteed)
 

N2PGames

New Member
Messages
470
Reaction score
0
Points
0
Thanks for all the help from everyone but, I still have that issue

I'll upload the HTML file so you all can see what I'm talking about :D

heres how i want mine to act :
Code:
http://www.clantemplates.com/templates/frontline:fieldsofthunder_obscurity/
 

Attachments

  • testHTML.rar
    8.4 KB · Views: 13
Last edited:

Chris Z

Active Member
Messages
5,603
Reaction score
0
Points
36
yup, Zenax is right, so if you want to do table width's in percentages or w/e, you'd do
HTML:
<table style="width:15%;">
you can also use this on <tr>'s and <td>'s
only good idea to use height(because he is talking about height) for table
ya..sorry about that, i was thinking about the way i usually use it, i have never used percentages for height
 

N2PGames

New Member
Messages
470
Reaction score
0
Points
0
I figured out the how to make the top header reach the top :D

But the footer still doesn't

In Dreamweaver i selected all teh tables and did the Page Props

and put 1 in Top margin= 1, and Bottom margin= 1

the top part works but the bottom still doesn't reach down
 
Last edited:

Chris Z

Active Member
Messages
5,603
Reaction score
0
Points
36
try more than 1 for the bottom margin, see if it does anything
 

Cubeform

New Member
Messages
339
Reaction score
0
Points
0
How 'bout you don't use tables at all and use DIVs?

But enough of that silliness; I shouldn't be advertising DIVs here.

I will try and help you on this, because for the header, it has nothing to do with the table at all.

Put this in your CSS file:

Code:
body {
  margin: 0;
  padding: 0;
}

EDIT:
For the footer: You know what? Many people have tried this; none have really succeeded without modifying their designs. So, you know what I would do? Modify the design. There is simply no way to achieve this with tables or any other type of layout.
 
Last edited:

N2PGames

New Member
Messages
470
Reaction score
0
Points
0
Thank you :D....

i will try that code and if it fails i'll try the Divs but what i like about tables is that their very easy to move around.

but if the redoing and etc.. fail for me i'll just make the bottom footer image have a dropshadow.
 
Top