Display problems with DIVs

Discussion in 'HTML' started by test2000, Aug 1, 2007.

  1. test2000

    test2000 Guest

    Hello

    I have the following code

    <div id="Page" style="width: 300px;">
    <div id="map" style="width: 280px;">...</div>
    <div id="HiddenMenu" style="width: 20px;"> ... </div>
    </div>

    CSS definition for DIV "map" --> float: left;

    in the DIV "HiddenMenu" is a table which is exactly 20px wide.

    Unfortunately the DIV "HiddenMenu" is shown under the DIV "map", not
    to the right as desired. This problems only occures in IE6 and lower,
    not in IE7 or Firefox.

    I increased the width of DIV "Page", to 301 and 302. Nothing happened.
    But with a value of 303 the DIV "HiddenMenu" is shown on the right
    side. But now DIV "Page" is 303 wide and there is a gap of 3 pixel
    between the DIV "map" and "HiddenMenu"

    Here is the link to the HTML file: http://vueltaa.awardspace.com/problem.html

    I read about the Box Model Hack. But these doesn't bring a solution as
    my margin and padding are both zero.

    Does anyone have a hint as were to look for a solution for this
    problem?

    Any help is greatly appreciated.

    thx
     
    test2000, Aug 1, 2007
    #1
    1. Advertising

  2. test2000

    Chaddy2222 Guest

    test2000 wrote:
    > Hello
    >
    > I have the following code
    >
    > <div id="Page" style="width: 300px;">
    > <div id="map" style="width: 280px;">...</div>
    > <div id="HiddenMenu" style="width: 20px;"> ... </div>
    > </div>
    >
    > CSS definition for DIV "map" --> float: left;
    >
    > in the DIV "HiddenMenu" is a table which is exactly 20px wide.
    >
    > Unfortunately the DIV "HiddenMenu" is shown under the DIV "map", not
    > to the right as desired. This problems only occures in IE6 and lower,
    > not in IE7 or Firefox.
    >

    Frankly I would not bother supporting IE5.5 or lower, it's a waste of
    time really.

    > I increased the width of DIV "Page", to 301 and 302. Nothing happened.
    > But with a value of 303 the DIV "HiddenMenu" is shown on the right
    > side. But now DIV "Page" is 303 wide and there is a gap of 3 pixel
    > between the DIV "map" and "HiddenMenu"
    >


    <snip>
    You should use flash if you want perfect pixel design, it's the only
    way to do it. HTML is not really designed for that (it's designed to
    scale according to window size.)
    If you however want to continue down the HTML path, then visit
    http://www.htmldog.com and learne how to code properly!.
    Here is a free clue, don't assign widths to anything unless they
    really need it and then only use % or em units which will scale ok
    across various window sizes.
    --
    Regards Chad. http://freewebdesign.awardspace.biz
     
    Chaddy2222, Aug 1, 2007
    #2
    1. Advertising

  3. test2000

    dorayme Guest

    In article
    <>,
    Chaddy2222 <> wrote:

    >
    > test2000 wrote:
    > > Hello
    > >
    > > I have the following code
    > >
    > > <div id="Page" style="width: 300px;">
    > > <div id="map" style="width: 280px;">...</div>
    > > <div id="HiddenMenu" style="width: 20px;"> ... </div>
    > > </div>
    > >
    > > CSS definition for DIV "map" --> float: left;
    > >
    > > in the DIV "HiddenMenu" is a table which is exactly 20px wide.
    > >
    > > Unfortunately the DIV "HiddenMenu" is shown under the DIV "map", not
    > > to the right as desired. This problems only occures in IE6 and lower,
    > > not in IE7 or Firefox.
    > >

    > Frankly I would not bother supporting IE5.5 or lower, it's a waste of
    > time really.


    Can you pick on anything even more marginal to OP's question?

    --
    dorayme
     
    dorayme, Aug 1, 2007
    #3
  4. test2000

    Chaddy2222 Guest

    dorayme wrote:
    > In article
    > <>,
    > Chaddy2222 <> wrote:
    >
    > >
    > > test2000 wrote:
    > > > Hello
    > > >
    > > > I have the following code
    > > >
    > > > <div id="Page" style="width: 300px;">
    > > > <div id="map" style="width: 280px;">...</div>
    > > > <div id="HiddenMenu" style="width: 20px;"> ... </div>
    > > > </div>
    > > >
    > > > CSS definition for DIV "map" --> float: left;
    > > >
    > > > in the DIV "HiddenMenu" is a table which is exactly 20px wide.
    > > >
    > > > Unfortunately the DIV "HiddenMenu" is shown under the DIV "map", not
    > > > to the right as desired. This problems only occures in IE6 and lower,
    > > > not in IE7 or Firefox.
    > > >

    > > Frankly I would not bother supporting IE5.5 or lower, it's a waste of
    > > time really.

    >
    > Can you pick on anything even more marginal to OP's question?
    >

    I not really trying to pick on the OP. However the CSS support in
    browsers before IE6 is not that good and so it would be easier for the
    OP to just not bother supporting them (or if you really want to
    support IE5.0 then provide a fall-back solution.
    But you stilll should code for IE6 as 30% of the browser market still
    use it.
    --
    Regards Chad. http://freewebdesign.awardspace.biz
     
    Chaddy2222, Aug 1, 2007
    #4
  5. test2000

    dorayme Guest

    In article
    <>,
    Chaddy2222 <> wrote:

    > dorayme wrote:
    > > In article
    > > <>,
    > > Chaddy2222 <> wrote:


    > > > Frankly I would not bother supporting IE5.5 or lower, it's a waste of
    > > > time really.

    > >
    > > Can you pick on anything even more marginal to OP's question?
    > >

    > I not really trying to pick on the OP.


    I never implied that you did.

    --
    dorayme
     
    dorayme, Aug 1, 2007
    #5
  6. test2000

    Neredbojias Guest

    Well bust mah britches and call me cheeky, on Wed, 01 Aug 2007 07:21:54
    GMT test2000 scribed:

    > Hello
    >
    > I have the following code
    >
    > <div id="Page" style="width: 300px;">
    > <div id="map" style="width: 280px;">...</div>
    > <div id="HiddenMenu" style="width: 20px;"> ... </div>
    > </div>
    >
    > CSS definition for DIV "map" --> float: left;
    >
    > in the DIV "HiddenMenu" is a table which is exactly 20px wide.
    >
    > Unfortunately the DIV "HiddenMenu" is shown under the DIV "map", not
    > to the right as desired. This problems only occures in IE6 and lower,
    > not in IE7 or Firefox.
    >
    > I increased the width of DIV "Page", to 301 and 302. Nothing happened.
    > But with a value of 303 the DIV "HiddenMenu" is shown on the right
    > side. But now DIV "Page" is 303 wide and there is a gap of 3 pixel
    > between the DIV "map" and "HiddenMenu"
    >
    > Here is the link to the HTML file:
    > http://vueltaa.awardspace.com/problem.html
    >
    > I read about the Box Model Hack. But these doesn't bring a solution as
    > my margin and padding are both zero.
    >
    > Does anyone have a hint as were to look for a solution for this
    > problem?
    >
    > Any help is greatly appreciated.


    I copied your markup and the 2nd div is under the first in _all_ browsers
    I tried.

    --
    Neredbojias
    Half lies are worth twice as much as whole lies.
     
    Neredbojias, Aug 1, 2007
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?ISO-8859-1?Q?Tom=E1=9A_Bedn=E1=F8?=

    DIVs floating to left display incorrect if IE4

    =?ISO-8859-1?Q?Tom=E1=9A_Bedn=E1=F8?=, Oct 23, 2003, in forum: HTML
    Replies:
    2
    Views:
    531
    Toby A Inkster
    Oct 24, 2003
  2. Christofer Dutz
    Replies:
    1
    Views:
    1,016
    Neredbojias
    Aug 29, 2005
  3. Replies:
    8
    Views:
    3,054
  4. rich
    Replies:
    0
    Views:
    734
  5. maya
    Replies:
    4
    Views:
    250
Loading...

Share This Page