two div in one line, first div"s width is const and the second isn"t
two div in one line, first div"s width is const and the second isn"t
am 25.06.2007 19:40:47 von tomek milewski
Hello,
I want to make a simple html page. It has a header div, a main div and
some footer div.
I want to make main div to contain two columns (menu and content):
menu div has fixed width (lets say 150px) and I want to make the
content div taking the rest of the container div width (which is for
example 100%).
I found out that making menu and content "float:left" allows them to
be in one line. Bu when I've written more text into content, it became
so wide that my browser broke the line :(
I also found out that making the menu "position:relative" and adding a
"margin-left:150px" to content also helps. But then I realized that if
menu is high and content is short, then menu crashes with footer.
Now I have no idea, except making content's width fixed.
Any help would be apreciated!
Re: two div in one line, first div"s width is const and the secondisn"t
am 25.06.2007 20:21:34 von Edwin van der Vaart
tomek milewski wrote:
> Hello,
> I want to make a simple html page. It has a header div, a main div and
> some footer div.
> I want to make main div to contain two columns (menu and content):
>
>
>
> menu div has fixed width (lets say 150px) and I want to make the
> content div taking the rest of the container div width (which is for
> example 100%).
>
> I found out that making menu and content "float:left" allows them to
> be in one line. Bu when I've written more text into content, it became
> so wide that my browser broke the line :(
>
> I also found out that making the menu "position:relative" and adding a
> "margin-left:150px" to content also helps. But then I realized that if
> menu is high and content is short, then menu crashes with footer.
>
> Now I have no idea, except making content's width fixed.
Use for the footer "clear:both". That way the menu stays left and
content on the right.
--
Edwin van der Vaart
http://www.semi-conductor.nl/ Links to Semiconductors sites
http://www.evandervaart.nl/ Edwin's persoonlijke web site
Explicitly no permission given to Forum4Designers, onlinemarketingtoday,
24help.info, issociate.de and software-help1.org to duplicate this post.
Re: two div in one line, first div"s width is const and the second isn"t
am 25.06.2007 21:20:21 von tomek milewski
On Jun 25, 8:21 pm, Edwin van der Vaart wrote:
> tomek milewski wrote:
> > Hello,
> > I want to make a simple html page. It has a header div, a main div and
> > some footer div.
> > I want to make main div to contain two columns (menu and content):
>
> >
>
> > menu div has fixed width (lets say 150px) and I want to make the
> > content div taking the rest of the container div width (which is for
> > example 100%).
>
> > I found out that making menu and content "float:left" allows them to
> > be in one line. Bu when I've written more text into content, it became
> > so wide that my browser broke the line :(
>
> > I also found out that making the menu "position:relative" and adding a
> > "margin-left:150px" to content also helps. But then I realized that if
> > menu is high and content is short, then menu crashes with footer.
>
> > Now I have no idea, except making content's width fixed.
>
> Use for the footer "clear:both". That way the menu stays left and
> content on the right.
> --
> Edwin van der Vaarthttp://www.semi-conductor.nl/ Links to Semiconductors siteshttp://www.evandervaart.nl/ Edwin's persoonlijke web site
> Explicitly no permission given to Forum4Designers, onlinemarketingtoday,
> 24help.info, issociate.de and software-help1.org to duplicate this post.
Thanks for the advice but it doesn't work. If the content has too much
text inside, it is dropped to a new line, under left. It works only if
content is short enough to fit in one line.
--
Tomasz Milewski
Re: two div in one line, first div"s width is const and the secondisn"t
am 25.06.2007 21:27:28 von Bergamot
tomek milewski wrote:
>
> Thanks for the advice but it doesn't work. If the content has too much
> text inside, it is dropped to a new line, under left. It works only if
> content is short enough to fit in one line.
Post a URL.
--
Berg
Re: two div in one line, first div"s width is const and the second isn"t
am 25.06.2007 22:06:27 von tomek milewski
On Jun 25, 9:27 pm, Bergamot wrote:
> tomek milewski wrote:
>
> > Thanks for the advice but it doesn't work. If the content has too much
> > text inside, it is dropped to a new line, under left. It works only if
> > content is short enough to fit in one line.
>
> Post a URL.
>
> --
> Berg
I've just uploded it on that site:
http://htmtest.republika.pl/
--
Tomasz Milewski
Re: two div in one line, first div"s width is const and the second isn"t
am 25.06.2007 23:20:49 von Ben C
On 2007-06-25, tomek milewski wrote:
> On Jun 25, 9:27 pm, Bergamot wrote:
>> tomek milewski wrote:
>>
>> > Thanks for the advice but it doesn't work. If the content has too much
>> > text inside, it is dropped to a new line, under left. It works only if
>> > content is short enough to fit in one line.
>>
>> Post a URL.
>>
>> --
>> Berg
> I've just uploded it on that site:
> http://htmtest.republika.pl/
Make .content { margin-left: 160px; } and don't float it.
Floats do drop underneath each other if there's not enough space
available, that's what they're supposed to do.
Re: two div in one line, first div"s width is const and the second isn"t
am 25.06.2007 23:28:16 von tomek milewski
On Jun 25, 11:20 pm, Ben C wrote:
> On 2007-06-25, tomek milewski wrote:
>
> > On Jun 25, 9:27 pm, Bergamot wrote:
> >> tomek milewski wrote:
>
> >> > Thanks for the advice but it doesn't work. If the content has too much
> >> > text inside, it is dropped to a new line, under left. It works only if
> >> > content is short enough to fit in one line.
>
> >> Post a URL.
>
> >> --
> >> Berg
> > I've just uploded it on that site:
> >http://htmtest.republika.pl/
>
> Make .content { margin-left: 160px; } and don't float it.
>
> Floats do drop underneath each other if there's not enough space
> available, that's what they're supposed to do.
This is IT! Thank You very much.
--
Tomasz Milewski