Divs overlapping?

[T.J.]

I've just built my first page without using
tables.
It has 2 main Divs, a small not so important one on
the left, and the main one on the right.
As I reduce the size of the page from the sides,
the main Div slides under the minor one.
How can I make it so it slides over rather than under?
The page is at
www.sim64.co.uk/queens.html
TIA.

 

[brucie]

In alt.html T.J. said:

I've just built my first page without using tables.
YAY!

It has 2 main Divs, a small not so important one on the left, and the
main one on the right.

i'm waaaay to lazy to go through your css except to note its waaaay more
complex than it needs to be. KISS

As I reduce the size of the page from the sides, the main Div slides
under the minor one.

not with my browser

How can I make it so it slides over rather than under?
The page is at www.sim64.co.uk/queens.html

basic 2 col layout. the menu is floated into the left margin of the
content <div>. easy peasy:
http://moreshit.usenetshit.info/queen.shit

 

[T.J.]

In alt.html T.J. said:


i'm waaaay to lazy to go through your css except to note its waaaay more
complex than it needs to be. KISS


not with my browser


basic 2 col layout. the menu is floated into the left margin of the
content <div>. easy peasy:
http://moreshit.usenetshit.info/queen.shit

Thanks Brucie, but still not the effect I am after.
That makes the content div jut keep reducing and the left menu
stay the same.
I want the content div to reduce to know smaller than the top image
and then slide over the left menu div rather than under it.

 

[brucie]

In alt.html T.J. said:

That makes the content div jut keep reducing and the left menu
stay the same.

and that is an issue because?

I want the content div to reduce to know smaller than the top image
min-width:

and then slide over the left menu div rather than under it.

stop wanting that, just use min-width.

 

[T.J.]

In alt.html T.J. said:


and that is an issue because?

Curiosity mainly, I'm new to all this and just want to know
how to do it, also, it makes the left menu div look more important
than the content div on a quarter screen

stop wanting that, just use min-width.

I assume min-width creates a horizontal sroll bar once you reach the
width you have set it to? and how do you set a min-width?

 

[brucie]

In alt.html T.J. said:

Curiosity mainly, I'm new to all this and just want to know
how to do it, also, it makes the left menu div look more important
than the content div on a quarter screen

you're worrying about nothing. generally you would like to avoid the
menu shrinking/expanding except for font size changes so it doesn't look
crap/becomes difficult to use or even falls apart.

I assume min-width creates a horizontal sroll bar once you reach the
width you have set it to?

correct. remember you only have to build into your design enough
flexibility for a reasonable range of situations. if some nut has their
browser window at 100px width thats their problem.

and how do you set a min-width?

min-width:whatever; on the element you want to restrict.

hit refresh (requires a modern browser)
http://moreshit.usenetshit.info/queen.shit

 

[T.J.]

In alt.html T.J. said:


you're worrying about nothing. generally you would like to avoid the
menu shrinking/expanding except for font size changes so it doesn't look
crap/becomes difficult to use or even falls apart.

Yes, I guess I'm just being to finiky, not much chance of anyone
viewing in their browser so small that it causes any problem.

correct. remember you only have to build into your design enough
flexibility for a reasonable range of situations. if some nut has their
browser window at 100px width thats their problem.


min-width:whatever; on the element you want to restrict.

Works fine in Opera, but doesn't seem to work in IE6
(or is that swearing to you)

 

[brucie]

In alt.html T.J. said:

Works fine in Opera,

of course

but doesn't seem to work in IE6
aahhhaaa

(or is that swearing to you)

no, its ok. i cry like this all the time.

 

[Nik Coughin]

Works fine in Opera, but doesn't seem to work in IE6
(or is that swearing to you)

That's what he meant by a more modern browser. IE6 is positively
antiquated.

 

[Deryck]

In alt.html T.J. said:

I dont suppose you have a fix/hack/kludge for the
IE-doesnt-support-min-width problem do you Brucie? One that doesnt involves
javascript?

Hoping,


Deryck

 

[brucie]

In alt.html Deryck said:

I dont suppose you have a fix/hack/kludge for the
IE-doesnt-support-min-width problem do you Brucie?

never bothered looking for one. do people still use IE?

 

[T.J.]

I dont suppose you have a fix/hack/kludge for the
IE-doesnt-support-min-width problem do you Brucie? One that doesnt
involves javascript?

Hoping,


Deryck

Cheating I know ;o) but this works in IE
<img src="whiteline.jpg" height="0" width="550" alt="">

 

[Robert Frost-Bridges]

I dont suppose you have a fix/hack/kludge for the
IE-doesnt-support-min-width problem do you Brucie? One that doesnt
involves javascript?

There's one that goes along the lines of:

body {
width:500px;
}

html>body {
width:auto;
min-width:500px;
}

all to do with ie not recognising child selectors and treating width as
min-width. I can't say how effective it is though.

 

[Deryck]

never bothered looking for one. do people still use IE?

Fraid so, about 95% of them apparently

 

[Deryck]

There's one that goes along the lines of:

body {
width:500px;
}

html>body {
width:auto;
min-width:500px;
}

all to do with ie not recognising child selectors and treating width as
min-width. I can't say how effective it is though.

Thanks Frostie. Yes Ive seen that one. I think it means that you lose the
functionality of width in IE though.