How to let the layout laterals auto sizing?

[Neviton]

Hi
I want to create one layout with 3 columns.

The left and right columns should have a auto-width.
The center column should have a fixed size of 300px.

By example:

If the browser window width is 500px I need the left column have
width=100px and right column have width=100px and center off course
width=300px.

If the browser window width is 300px then both left and right have
width=0px and the center keep with width=300px.

Obs.:
The left and right columns will be empty but having a different
background for each one.

If possible I prefer a tableless solution.

[Ben C]

Re: How to let the layout laterals auto sizing?

On 2008-03-26, Neviton <nevitones@gmai l.comwrote:

Hi
I want to create one layout with 3 columns.
>
The left and right columns should have a auto-width.
The center column should have a fixed size of 300px.
>
By example:
>
If the browser window width is 500px I need the left column have
width=100px and right column have width=100px and center off course
width=300px.
>
If the browser window width is 300px then both left and right have
width=0px and the center keep with width=300px.
>
Obs.:
The left and right columns will be empty but having a different
background for each one.
>
If possible I prefer a tableless solution.

Float the left column left, float the right column right, leave the
middle column normal-flow and give it left and right margins of 100px.

[dorayme]

Re: How to let the layout laterals auto sizing?

In article
<b6552209-1e0a-4de6-a63c-c34c582b4da5@8g 2000hse.googleg roups.com>,
Neviton <nevitones@gmai l.comwrote:

Hi
I want to create one layout with 3 columns.
>
The left and right columns should have a auto-width.
The center column should have a fixed size of 300px.
>
By example:
>
If the browser window width is 500px I need the left column have
width=100px and right column have width=100px and center off course
width=300px.
>
If the browser window width is 300px then both left and right have
width=0px and the center keep with width=300px.
>
Obs.:
The left and right columns will be empty but having a different
background for each one.
>
If possible I prefer a tableless solution.

Not really possible under your conditions I am afraid. Care to lower the
bar a bit?

--
dorayme

[Bergamot]

Re: How to let the layout laterals auto sizing?

mynameisnobodyo dyssea@googlema il.com wrote:

>
search engines guidelines recommend to
avoid negative margins.

What do negative margins (or any CSS for that matter) have to do with
search engines? I'd like to know where you read such guidelines.

--
Berg

[mynameisnobodyodyssea@googlemail.com]

Re: How to let the layout laterals auto sizing?

On Mar 27, 5:43 pm, Bergamot <berga...@visi. comwrote:

mynameisnobodyo dyseea wrote:
>

search engines guidelines recommend to
avoid negative margins.

>
What do negative margins (or any CSS for that matter) have to do with
search engines? I'd like to know where you read such guidelines.
>
--
Berg

Google (and probably other search engines as well) does not
like hidden content, see

http://www.google.com/support/webmasters/bin/answer.py?answer=66353

about CSS see the bit about not using CSS to hide text.

Negative margins can hide content,
content that could be in the source of a page but not
visible on a screen.
(Other style information that can hide content
are setting display:none, or setting the font size to 0,
or using similar-colour text and background, etc.....)

It depends on the content of the page of course.
Negative margins are used a lot for layout and they are
very good and useful in styling,
but the fact that sometimes they can be used to hide content
is something to consider,
maybe not to use negative margins if there are other solutions,
just in case.

There is no fixed rule about search engines and
negative margins,
but I thought it was better to mention that
there can be some doubts about the use of
negative margins in some cases.

[Sherman Pendley]

Re: How to let the layout laterals auto sizing?

Bergamot <bergamot@visi. comwrites:

mynameisnobodyo dyssea@googlema il.com wrote:

>>
>search engines guidelines recommend to
>avoid negative margins.

>
What do negative margins (or any CSS for that matter) have to do with
search engines?

They're used by cheaters to include non-relevant keywords in HTML that
are invisible to most human visitors. Another common sign that someone
is trying to game the search engines is identical text and background
colors.

sherm--

--
My blog: http://shermspace.blogspot.com
Cocoa programming in Perl: http://camelbones.sourceforge.net

[Bergamot]

Re: How to let the layout laterals auto sizing?

mynameisnobodyo dyssea@googlema il.com wrote:

On Mar 27, 5:43 pm, Bergamot <berga...@visi. comwrote:

>mynameisnobody odyseea wrote:
>>

search engines guidelines recommend to
avoid negative margins.

>>
>What do negative margins (or any CSS for that matter) have to do with
>search engines? I'd like to know where you read such guidelines.

>
Google (and probably other search engines as well) does not
like hidden content

Yeah, we all know that.

Negative margins can hide content,

So? One has nothing to do with the other.

Google is referring to keyword spamming in the content and trying to
hide it from human visitors.

There are valid uses for display:none, visibility:hidd en and negative
margins that have nothing to do with spamming search engines.

Negative margins are used a lot for layout and they are
very good and useful in styling,
but the fact that sometimes they can be used to hide content
is something to consider,

Huh? As far as search engines go, there's nothing to consider unless
your *intent* is keyword spamming.

--
Berg

[Gus Richter]

Re: How to let the layout laterals auto sizing?

dorayme wrote:

>>>>
>>Nice Gus, but see what happens on text enlargement.

>What happens?

>
The side panels fall short and I was just thinking the OP might not find
this something he wants. That's all.

Yes, as hewhoshallnotbe named said, "if the content of the center box is
longer than the height of the window (viewport) ...." - so it's good to
those limitations.

His version is good but, "[only if] the content of the center bar
longer than the height of the window (viewport)" - so it's good to the
other limitations.

Is it possible to contrive a way to combine the two?

--
Gus

[mynameisnobodyodyssea@googlemail.com]

Re: How to let the layout laterals auto sizing?

On Mar 28, 3:34 am, Gus Richter wrote:

Yes, as hewhoshallnotbe named said, "if the content of the center box is
longer than the height of the window (viewport) ...." - so it's good to
those limitations.
>
His version is good but, "[only if] the content of the center bar
longer than the height of the window (viewport)" - so it's good to the
other limitations.
>
Is it possible to contrive a way to combine the two?
>
--
Gus

Hi Gus,
I am not a he, I am a she.
I thought that mynameisnobodyo dyssea would be fun,
like in the Odyssey, like
who wrote that? nobody wrote that...

Anyway, my suggestion was a variant on your
solution, that I think is very good and adaptable.
Also, a 300pixels centered column looks like
for mobile phones, so it is very likely that the
content would be longer than the screen height.
Another thing is that if the question was indeed for
mobile phones, it is a good idea for
whatever solution will be chosen to be
tested in as many mobile phone browsers as
possible, just in case.

It would be good if we would know more about
the initial question, like what are the backgrounds like.

[Neviton]

Re: How to let the layout laterals auto sizing?

THANK YOU EVERY ONE!!!

and sorry cause I know that Im so late that I dont know if all of you
still alive today heheheh

ANYWAY THANX YOU ALL

What I wanted with this was take the background image(that was big)
and take off 300px from the middle of it (to save some Kb from your
size) and then divide the image in two equal parts. Set the left part
of this image as background-image of the left column and set the right
part to the right column.

This could save several Kb from the web page.

I hope you dont think Im crazy(so much) @)))