Fixed Site Size

[Yogi_Bear_79]

I've played with "liquid design" and have decided for this site, the best
solution would be to build on a 800x600 basis. Basically what I want is to
have the page be full on a 800x600 screen, and have blank space on the right
or left when at a higher resolution.

My site is built using <DIV> tags getting their information from the CSS
file. Originally I made blank left and right columns, but they obviously
resize with the screen resolution.

How do I get the site to only utilize the section of the screen I indicated
in the first paragraph?

 

[Ed Jay]

Yogi_Bear_79 scribed:

I've played with "liquid design" and have decided for this site, the best
solution would be to build on a 800x600 basis. Basically what I want is to
have the page be full on a 800x600 screen, and have blank space on the right
or left when at a higher resolution.

My site is built using <DIV> tags getting their information from the CSS
file. Originally I made blank left and right columns, but they obviously
resize with the screen resolution.

How do I get the site to only utilize the section of the screen I indicated
in the first paragraph?

Begin with a div that's 800px wide less the width of scroll bars if you need
to.

 

[Nico Schuyt]

I've played with "liquid design" and have decided for this site, the
best solution would be to build on a 800x600 basis.

That's a contradictio in terminis Liquid design fits in (almost) any
window size.

Basically what I
want is to have the page be full on a 800x600 screen, and have blank
space on the right or left when at a higher resolution.
My site is built using <DIV> tags getting their information from the
CSS file. Originally I made blank left and right columns, but they
obviously resize with the screen resolution.
How do I get the site to only utilize the section of the screen I
indicated in the first paragraph?

No fixed size but something like http://www.nicoschuyt.nl/test/div_small.htm

 

[dorayme]

That's a contradictio in terminis

I don't think there is a contradiction here. A contradiction is
seriously bad beast.

Liquid design fits in (almost) any
window size.


No fixed size but something like http://www.nicoschuyt.nl/test/div_small.htm

"Liquid design fits in (almost) any window size"

Fits is not in doubt. But fits and is nice or useful, this is
another story. Very fine in abstract. And I am speaking as
someone who almost never uses fixed. But it is quite a decision
in practice. Take your url example. I personally would not want
to see a lot of text that wide on my 20" screen. I can really
very easily understand how tempting it is to bypass all the
design thinking by making the whole damn show for some sites
800px wide and be done! Will look fine on all screens 800 or
more. Saves endless playing about, endless worry, endless
max-widthing and then worrying about IE, eming, floating or
positioning divs to take up useful space for other things and so
on...

 

[Nico Schuyt]

Fits is not in doubt. But fits and is nice or useful, this is
another story. Very fine in abstract. And I am speaking as
someone who almost never uses fixed. But it is quite a decision
in practice. Take your url example. I personally would not want
to see a lot of text that wide on my 20" screen.

But text will almost always be wide on large monitors/windows. Do you
suggest to use a fixed width standard?

 

[dorayme]

But text will almost always be wide on large monitors/windows. Do you
suggest to use a fixed width standard?

This is not so with good design, my point is that one needs to
put on a thinking cap big time sometimes to solve the various
design problems around this issue. It is not a simple one. I
would hate to read a line of text 16 inches long...

I think that what can happen with pushing the liquid layout
message too strongly is that one then has to turn around to
constrain things in other ways. These other ways may be worth it.
But they are time consuming. And you achieve little benefit for
things like essays that bang on for quite a while, no pics, no
nothing else, just words.

If you want to have a discussion about this, here is a concrete
example, cf

http://members.optushome.com.au/droovies/opinion/drugLaws.html


http://members.optushome.com.au/droovies/opinion/drugLawsFixed.htm
l


Or substitute anything else. There are various irritations
whatever one sets for the width of the main div, px, ems, max,
just width... I fiddle faddle constantly with such things and am
secretly jealous of someone who has no qualms of setting the
width to 600px or 800px and leaving it at that.

My point is where in all this is the liquidity that is so
valuable? There are so many different liquidities... Frankly,
9what i have only set for an example here, the 600px fixed, suits
me and is likely easier cross browser. But I realise it is all
debateable.

[I am surer about the evils of prohibition than liquid design!
]

 

[Chris F.A. Johnson]

I think that what can happen with pushing the liquid layout
message too strongly is that one then has to turn around to
constrain things in other ways. These other ways may be worth it.
But they are time consuming. And you achieve little benefit for
things like essays that bang on for quite a while, no pics, no
nothing else, just words.

If you want to have a discussion about this, here is a concrete
example, cf

http://members.optushome.com.au/droovies/opinion/drugLaws.html


http://members.optushome.com.au/droovies/opinion/drugLawsFixed.html

Both of those work well, because neither uses a fixed width.

 

[Nico Schuyt]

dorayme wrote:

I fiddle faddle constantly with such things and am

secretly jealous of someone who has no qualms of setting the
width to 600px or 800px and leaving it at that.

Take care, this is an open forum! Liquid Design is sacred. There's a serious
risk of being excommunicated

 

[dorayme]

Both of those work well, because neither uses a fixed width.

Not "because neither uses a fixed width". Let me explain briefly:
true, I was rushing to get out to the beach and have my afternoon
swim [1] and forgot to knock off the "max-" bit off the div
width. If you would kindly knock it off and see the result, it
still works fine, in fact, pretty much the same in decent
browsers, who is going to go lower than 600 wide, even Alan
Flavell would cope on one of his machines.

You can make the technical point that it is still "liquid" with
the max-width in, I am making the point that in many cases it
really is not a big deal which way you go for some things and
further that in some cases it saves a headache going truly fixed.
But I am still thinking about all this stuff (I rarely use fixed
myself, I wonder why the hell not sometimes! So many lovely sites
employ it)

[By the way, eat your hearts out you miserable, wretched, cold
northern hemisphere earthlings, later this avo, I will go for a
swim at

http://members.optusnet.com.au/mons1/page6.htm

but realise this: nowadays the beach is in full colour and is too
glorious to tease you with.]

 

[Andy Dingley]

Not "because neither uses a fixed width". Let me explain briefly:
true, I was rushing to get out to the beach and have my afternoon
swim

Yes, but on _our_ planet we still have surface water, not dry canals.

 

[dorayme]

Yes, but on _our_ planet we still have surface water, not dry canals.

The pic at the top of
http://www.csiro.au/csiro/channel/ich3u,,.html sure reminds me of
home...

 

[Yogi_Bear_79]

Yogi_Bear_79 scribed:

Begin with a div that's 800px wide less the width of scroll bars if you
need
to.

Not sure why I can't figure this one out. I entered the following in my CSS

#MainBody{
position:absolute;
width:800px;
height:600px;
}

Opened it in the HTML like so
<body>
<div id="MainBody" align="center">
.....
</div>
</body>

 

[dorayme]

Not sure why I can't figure this one out. I entered the following in my CSS

#MainBody{
position:absolute;
width:800px;
height:600px;
}

Opened it in the HTML like so
<body>
<div id="MainBody" align="center">
....
</div>
</body>

You don't need to use absolute positioning. Given your desires,
just a div 800px wide, make it 750px and see if you like it
etc... If you want to centre the div, do so, that is an
independent variable.

 

[Yogi_Bear_79]

You don't need to use absolute positioning. Given your desires,
just a div 800px wide, make it 750px and see if you like it
etc... If you want to centre the div, do so, that is an
independent variable.

Ok, I changed it to

MainBody{
align:center;
width:800px;
}

Opened it in the HTML like so
<body>
<div id="MainBody">
</div>
</body>

The only item that appears to be affected is the header DIV which moved over
to the right , but isn't limited to 800px. I am calling multiple <DIV> tags
within the <div id="MainBody">. They are all sized by percentage, they are
also using absolute positioning, could one they be the problem?

 

[dorayme]

You don't need to use absolute positioning. Given your desires,
just a div 800px wide, make it 750px and see if you like it
etc... If you want to centre the div, do so, that is an
independent variable.

Ok, I changed it to

MainBody{
align:center;
width:800px;
}

Opened it in the HTML like so
<body>
<div id="MainBody">
</div>
</body>

The only item that appears to be affected is the header DIV which moved over
to the right , but isn't limited to 800px. I am calling multiple <DIV> tags
within the <div id="MainBody">. They are all sized by percentage, they are
also using absolute positioning, could one they be the problem?[/QUOTE]


No, don't centre things with align.

With the div fixed at 800px, say:

#MainBody {

width:800px;
margin-left:auto;
margin-right:auto;
}

Have you got a url or maybe I missed it? Have no idea what you
have with the other divs?

 

[Yogi_Bear_79]

Ok, I changed it to

MainBody{
align:center;
width:800px;
}

Opened it in the HTML like so
<body>
<div id="MainBody">
</div>
</body>

The only item that appears to be affected is the header DIV which moved
over
to the right , but isn't limited to 800px. I am calling multiple <DIV>
tags
within the <div id="MainBody">. They are all sized by percentage, they
are
also using absolute positioning, could one they be the problem?

No, don't centre things with align.

With the div fixed at 800px, say:

#MainBody {

width:800px;
margin-left:auto;
margin-right:auto;
}

Have you got a url or maybe I missed it? Have no idea what you
have with the other divs?
[/QUOTE]

Tried that different results, but not right..here's the test URL
http://314rcsspouses.homedns.org/hollywoodoil/index.shtml

 

[dorayme]

Tried that different results, but not right..here's the test URL
http://314rcsspouses.homedns.org/hollywoodoil/index.shtml

This has too many errors to deal with.

<http://validator.w3.org/check?verbose=1&uri=http://314rcssp
ouses.homedns.org%2Fhollywoodoil%2Findex.shtml>

You using Frontpage? I suggest you don't for now.

I would start from scratch again.

 

[Yogi_Bear_79]

This has too many errors to deal with.

<http://validator.w3.org/check?verbose=1&uri=http://314rcssp
ouses.homedns.org%2Fhollywoodoil%2Findex.shtml>

You using Frontpage? I suggest you don't for now.

I would start from scratch again.

I'm using DreamWeaver, and not the GUI, just the code side. I ran the
validator as well, 90% of the items it is flagging appear to be correct when
I manually look at the code. So you are saying the way I am creating the
MainBody Div in the css file is correct, and the way and place I am calling
it in the HTML are correct? If that is the case then it must be the sizing
of the other <DIV> tags within the MainBody tag.....

For Example: Error Line 46 column 66: end tag for element "B" which is not
open.
....enu("aboutus2","<b>&nbsp;About&nbspUs&nbsp&nbsp;</b>")Is it saying the
closing </b> tag is not there?

 

[Jonathan N. Little]

I'm using DreamWeaver, and not the GUI, just the code side. I ran the
validator as well, 90% of the items it is flagging appear to be correct when
I manually look at the code. So you are saying the way I am creating the
MainBody Div in the css file is correct, and the way and place I am calling
it in the HTML are correct? If that is the case then it must be the sizing
of the other <DIV> tags within the MainBody tag.....

For Example: Error Line 46 column 66: end tag for element "B" which is not
open.
...enu("aboutus2","<b>&nbsp;About&nbspUs&nbsp&nbsp;</b>")Is it saying the
closing </b> tag is not there?

I don't know about that line but a very quick examination of your source
I saw several items like this:

<p align="center"><img align="absmiddle" src="images/BeckettLogo.gif"</p>

See the error??? Hint: look at the IMG tag...

Plus you have lots of deprecated presentational markup that you should
define in your stylesheet and not in your HTML

 

[Andy Dingley]

I'm using DreamWeaver, and not the GUI, just the code side. I ran the
validator as well, 90% of the items it is flagging appear to be correct when
I manually look at the code.

Here's a clue. Either the validator is getting it grossly wrong, or
you're getting it wrong somewhere and you just haven't seen it yet.
Your call.... We get a _lot_ of W3C Validator bug reports in this ng,
yet it seems to need awfully few fixes.

And a hint - validators rarely report errors, they usually report the
first point _afterwards_ when the document became provably invalid
after an earlier error. So if you can't see what the error was, start
looking where it was reported, then scan back upwards through it.