[Last Call] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

Making an HTML / CSS Stretch Layout

Posted on 2007-07-25
5
Medium Priority
?
280 Views
Last Modified: 2013-11-19
What's the best way, using CSS or <table>'s, to make a layout that stretches across an entire browser window like so:

Left column=x%                 Middle Column=715px                         Right Column=x%

In other words, the left and right columns should take up the remaining slack that the 715px middle column leaves remaining depending on the client's screen resolution, and the middle column remains centered and at a fixed 715px.

Thanks!
0
Comment
Question by:dancablam
  • 2
  • 2
5 Comments
 
LVL 8

Expert Comment

by:_Marcel_
ID: 19563694
Ah, a classic question: use CSS or table...

Of course the cleanest way to do it is to use CSS. The question only is: what browsers do you intent to support? If you want to support older browsers and/or exotic ones, then CSS may not be a good option for you, and you may need to use tables.

Tables will almost always work, but it is far less flexible, and it will not seperate your content and your styling. If that is not an issue for you (although it should be), then stick to tables.
0
 
LVL 3

Author Comment

by:dancablam
ID: 19563783
I guess I need a good example of how to do it, not so much which one to use. Sorry for not being clearer. Thanks.
0
 
LVL 8

Assisted Solution

by:_Marcel_
_Marcel_ earned 800 total points
ID: 19564287
A good article to read is http://theodorakis.net/tablecentertest.html It shows both methods and explains them.

Here is another good example for the css:
http://webdesign.about.com/od/css/ht/htcsscenterfix.htm

0
 
LVL 30

Accepted Solution

by:
VirusMinus earned 1200 total points
ID: 19608342
0
 
LVL 30

Expert Comment

by:VirusMinus
ID: 19608349
_Marcel_  you're layout is a normal fixed width centered layout. not what dancablam is looking for.
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question