/    Sign up×
Community /Pin to ProfileBookmark

Complicated table layout

Copy linkTweet thisAlerts:
Feb 22.2003

I am using a table layout for my entire site, embedded with many other tables as well. I have navigation areas at the left and the right of my site, which I would like to stay locked to the top of the page. I have set them to have height=150 so they should not resize. Underneath these navigation cells, I have created a new table cell and not specified the height. This is in an attemp to resize this cell to get larger as the main body of the site in the middle gets larger, which should then leave the navigation cells unaffected.

This does not work as I had planned, when the middle area (which has rowspan=200 so it should not affect other cells) gets longer, the navigation cells at the side stretch out to account for the new table height. Is there some sort of code to prevent these cells resizing at all, and perhaps have an empty cell that does resize at the bottom, where it is not noticeable.

See what I mean here:
[url]http://www.mastahuk.com/[/url]
(I have left border=1 at the moment so you can clearly see what is happenening. Once fixed I will put it back to border=0)

to post a comment
HTML

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@CharlesFeb 22.2003 — [i]Originally posted by MastahUK [/i]

[B]Is there some sort of code to prevent these cells resizing at all[?][/B][/QUOTE][font=georgia]No. Tables aren't supposed to be used for layout, they're supposed to be used to organize data. As such you can control only the minimum size and not the maximum.[/font][i]From the HTML 4.01 Specification:[/i]

[b]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.[/b][/quote]
Copy linkTweet thisAlerts:
@MastahUKauthorFeb 23.2003 — I have fixed this problem myself, still using tables to control the layout. I put the entire left side of the layout into a single td cell and placed the contents of this within embedded tables. I also did the same for the navigation at the right. This now means that the cells can resize themselves to the correct page height automatically and not affect the layout at all.
×

Success!

Help @MastahUK spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.21,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...