Specific 3 column div issue

[Stuart Palmer]

Hi everyone,

I want to create a web page using divs only (rather than tables) unless this
really isn't possible.

Basically my design consists of a centrally aligned content space of 760px
wide, however, to the left will be colour X and to the right colour Y, the
whole page needs to span the width of the browser window and the 760px
content space should not resize (otherwise it will mess up my design).
So the colours to the left and right are in effect background colours that
resize to the size of the browser window at a 50/50 ratio (so they are the
same size).

I have found lots of examples on the www using 3 column versions with
resizable content space, but the left and right sides are fixed widths.

Any help (or points in the right direction would be helpful

cheers
stu

--

 

[Jonathan N. Little]

Hi everyone,

I want to create a web page using divs only (rather than tables) unless this
really isn't possible.

Basically my design consists of a centrally aligned content space of 760px
wide, however, to the left will be colour X and to the right colour Y, the
whole page needs to span the width of the browser window and the 760px
content space should not resize (otherwise it will mess up my design).
So the colours to the left and right are in effect background colours that
resize to the size of the browser window at a 50/50 ratio (so they are the
same size).

I have found lots of examples on the www using 3 column versions with
resizable content space, but the left and right sides are fixed widths.

Any help (or points in the right direction would be helpful

URL? URL? URL? Picture worth a thousands words...

 

[Travis Newbury]

Hi everyone,

Hi Stu (if that is REALLY your name....)

I want to create a web page using divs only (rather than tables) unless this
really isn't possible.

Yea, you can do it

Basically my design consists of... bla bla bla bla bla

You need to provide a URL to what you currently have. This will allow
everyone to see what you are trying to say. If this will reside behind
a firewall and you can not provide a link, then go put the code up on
one of the many free servers.

Thanks for playing

 

[Beauregard T. Shagnasty]

I want to create a web page using divs only (rather than tables)
unless this really isn't possible.

It is certainly possible.

Basically my design consists of a centrally aligned content space of
760px wide, however, to the left will be colour X and to the right
colour Y, the whole page needs to span the width of the browser
window

Um, wait a minute. 760px is about as wide as a browser window can be on
an 800x600 monitor. What will happen to the side columns?

and the 760px content space should not resize (otherwise it
will mess up my design).

Unless you can show why this 760px absolutely must be exactly that wide,
then I would have to say your design has flaws.

So the colours to the left and right are in effect background colours
that resize to the size of the browser window at a 50/50 ratio (so
they are the same size).

What is in these side columns besides colours? Any worthy content?
Menus?

I have found lots of examples on the www using 3 column versions with
resizable content space, but the left and right sides are fixed
widths.

Here's a template that I like. Play with the sizes.
http://benmeadowcroft.com/webdev/csstemplates/3-column.html

 

[Stuart Palmer]

Basically I want to create a site that looks like

http://www.vauxhall.co.uk/

where the content space is 760 and the left and right is expandable but
the content always stays central.

Thanks,

Stuart

 

[Jonathan N. Little]

Stuart Palmer wrote:

Don't top post, the conversation gets confusing...

Basically I want to create a site that looks like

http://www.vauxhall.co.uk/

where the content space is 760 and the left and right is expandable but
the content always stays central.

Why? I run 1280x1024 so I get stuck with this little patch in the center
of the screen and my buddy over here with his cheap laptop and barely 13
inch screen will have to scroll!

 

[Beauregard T. Shagnasty]

Basically I want to create a site that looks like

http://www.vauxhall.co.uk/

That is not a page you want to emulate. [1]

where the content space is 760 and the left and right is expandable
but the content always stays central.

Why would you need those silly grey boxes sticking out on the sides?
Looks amateurish at best.

See the following:
http://allmyfaqs.net/faq.pl?AnySizeDesign

You still need to explain why your site needs to be exactly 760px wide.
Also consider how funny the vauxhall site looks on a maximized browser
window with a 1152x864 monitor.

If you won't consider that visitors have all different sized browsing
devices, look into setting a <div> for content, and setting its width,
with left and right margins set to auto, using CSS.

[1] Now I have to go and erase the cookies the vauxhall site wouldn't
operate without allowing. Way too much JavaScript and tracking scripts
at that site.

 

[Ed Seedhouse]

I want to create a web page using divs only (rather than tables) unless this
really isn't possible.

What can I say? This sentence alone displays a complete
misunderstanding of modern approaches to layout.

Using only divs is just as bad as using only tables.

To move from table based layouts to more modern techniques is not just a
matter of "using divs". A div is just another html element, useful for
grouping elements into sections, but otherwise devoid of any real
meaning.

You need to start fresh, and forget your old way of looking at making
web pages, at least for awhile.

First you should learn how to write semantic, valid html or xhtml. You
need to understand the idea of separating layout from presentation. You
need to understand that CSS is predicated on *valid* html or xhtml.

Your first pass through the codemight well not contain any divs at all.
Put headings in H elements, paragraphs in P elements, lists in UL or OL
elements, and so on. A menue is just a list in disguise. The tags you
use should reflect the *meaning* of the content.

Then when you have your content marked up meaningfully you apply CSS to
style and if necessary position it. You can add divs to separate the
sections you want to position.

Stay away from absolute and fixed positioning until your knowledge is
really advanced. Browsers don't support them all that well and they
support them differently so cross browser consistency becomes a problem.
Learn to use and understand floats, and use them for positioning.

No one goes to a web page for it's beauty or it's layout. They go, and
come back again, for the content. So content should come first.
Layout's purpose is to make the content most accessible. Beauty is good
too, but not at the expense of useability.

Remember the web is not paper and your users have all the power over
presentation (they may not use it, most don't, but they have it). They
use different screen resolutions, prefer different fonts and different
font sizes and they have control over all of those things and you don't.

These are all oversimplifications, of course, and when you really
understand what you are doing you can break any "rule". But perhaps
they are good enough to get you on the right path while you are
learning.

 

[Stuart Palmer]

Appriciate all your comments, however, the question wasn't 'was it right to
do it' but 'how to do it'.

I have a way to do it using a mixture of tables but from reading other
websites I have the understanding that it's best to use tables only for
tabular information, this is why I asked the question.

Regarding why I want to have content in a 760px area, most of my visitors
have 800x600 and 1024x768 resolution, therefore the small percentage that
have different resolution As long as the data is there to read and the text
is resizable then I am happy.

The design I have chosen will not work very well on a screen at 320
resolution and/or 1280 as my user base doesn't warrant this - this design is
my choice, it may not be yours but that's life. Consider a page that only
has a couple of paragraphs, this would look o.k on a 760 wide content space,
but having this run up to 1240 would make the page, and design look silly. I
try to achieve content that is informative to the users requirement but also
visually pleasing.

I also appriciate that people on newsgroups tend to know far more on topics
than others, however, advising people and complaining to people who are
asking for help are two different things. For example a url was asked for
what I want to achieve and indeed I supplied a url to explain what i am
trying to do, however, I then got slagged off becuase I did as requested
because the site I chose to show uses cookies, I provided this to enable you
to help me, if you are not willing to help I would appriciate if you didn't
reply to my posts.
If it is obvious someone doesn't understand a topic, then please exaplin and
advise, if it's not the best way to do a task - fine, explain why and how to
do it better, but offending people doesn't do you any favours and doesn't
get my question answered.

Thanks for any constructive help that can be offered to assist in resolving
my problem. If the solution is to do a mixture of tables and divs then
excellent, I have a solution already and I apologise for posting on here.

Kind Regards
Stuart

 

[Beauregard T. Shagnasty]

Appriciate all your comments, however, the question wasn't 'was it right to
do it' but 'how to do it'.

Well, this isn't a help desk, it's a discussion group. Besides, I
already told you how to do it:

"look into setting a <div> for content, and setting its width,
with left and right margins set to auto, using CSS."

I'll write it out for you.

#content { width: 760px; margin-left: auto; margin-right:auto; }

<div id="content">
<h1>This is the title.</h1>
<p>This is the content.</p>
</div>

About those with wide screens, why not set a max-width if you have a
sparse amount of content?

 

[Jonathan N. Little]

Appriciate all your comments, however, the question wasn't 'was it right to
do it' but 'how to do it'.

I have a way to do it using a mixture of tables but from reading other
websites I have the understanding that it's best to use tables only for
tabular information, this is why I asked the question.

Sorry, not a help desk. If members feel the question is wrong then your
will get info as to why.

Regarding why I want to have content in a 760px area, most of my visitors
have 800x600 and 1024x768 resolution, therefore the small percentage that
have different resolution As long as the data is there to read and the text
is resizable then I am happy.

And you collected this data how? Everyone who visits ALWAYS has the
browser maximized? I almost never do, since modern OS allow multitasking
and large monitors have become affordable.

The design I have chosen will not work very well on a screen at 320
resolution and/or 1280 as my user base doesn't warrant this - this design is
my choice, it may not be yours but that's life. Consider a page that only
has a couple of paragraphs, this would look o.k on a 760 wide content space,
but having this run up to 1240 would make the page, and design look silly. I
try to achieve content that is informative to the users requirement but also
visually pleasing.

Here is a good question for your, what if your visitor ups their
font-size? What will happen to your 760px static design?

I also appriciate that people on newsgroups tend to know far more on topics
than others, however, advising people and complaining to people who are
asking for help are two different things. For example a url was asked for
what I want to achieve and indeed I supplied a url to explain what i am
trying to do, however, I then got slagged off becuase I did as requested
because the site I chose to show uses cookies, I provided this to enable you
to help me, if you are not willing to help I would appriciate if you didn't
reply to my posts.
If it is obvious someone doesn't understand a topic, then please exaplin and
advise, if it's not the best way to do a task - fine, explain why and how to
do it better, but offending people doesn't do you any favours and doesn't
get my question answered.

Thanks for any constructive help that can be offered to assist in resolving
my problem. If the solution is to do a mixture of tables and divs then
excellent, I have a solution already and I apologise for posting on here.

It is actually more constructive than you realize....

 

[dorayme]

Appriciate all your comments, however, the question wasn't 'was it right to
do it' but 'how to do it'.

I don't think you do appreciate what Ed Seedhouse was saying. No
offence intended. It takes a while to see what he meant in spite
of him being crystal clear to those folk who understand this
stuff.

Stuart, you need an intro primer to the idea of semantic mark up
and you will find stuff via a Google search. You could look at
http://brainstormsandraves.com/articles/semantics/structure/

All your other remarks about all the rude b*stds on this ng are
quite correct. When I become king, they will all have much to
answer for. (They have mistreated me badly for a long time now
and my shrink says they are very naughty but that I must be
strong).

 

[Wÿrm]

"dorayme" <[email protected]> kirjoitti
viestissä:[email protected]...

When I become king, they will all have much to
answer for.

Lemme guess, some funny martian extra gender that would allow such thing to
happen?

<snip>