Re: CSS positioning help - Mozilla

Discussion in 'HTML' started by brucie, Jun 28, 2003.

  1. brucie

    brucie Guest

    In post <>
    Lorne Cameron said...

    > I've been trying to change my site's layout to CSS, but I've run into
    > some trouble. The layout is a header image, 760x115, then a menu image
    > on the left below that, 160x439, and then the main content in the
    > remaining space.


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <title>blah</title>
    <style type="text/css">
    body{margin:0;padding:0;}
    h1{height:115px;margin:0;border:2px solid red;}
    #menu{width:160px;height:439px;float:left;border:2px solid green;}
    #content{margin-left:165px;border:2px solid blue;}
    </style>
    <h1>header</h1>
    <div id="menu">menu<br>menu<br>menu<br>menu<br>menu<br>menu<br>menu<br></div>
    <div id="content">content<br>content<br>content<br>content<br>content<br></div>

    --
    brucie a. blackford. 29/June/2003 07:02:51 am kilo.
    http://loser.brucies.com/
    brucie, Jun 28, 2003
    #1
    1. Advertising

  2. brucie wrote:
    >>with one exception: is it possible to have the content DIV fill all
    >>remaining space vertically as well as hortizontally?>

    >
    > http://usenet.alt-html.org/layout-only-supported-by-opera-7-plus-thingy.html


    I'm not sure what you're trying to illustrate here, or if you understand
    my question. What I'm looking for is the layout equivalent to the
    following table:

    <TABLE WIDTH="100%" HEIGHT="100%">
    <TR>
    <TD COLSPAN="2">Header image, 760x115</TD>
    </TR>
    <TR>
    <TD WIDTH="160">Menu image, 160x439</TD>
    <TD ALIGN="center" VALIGN="middle">Content</TD>
    </TR>
    </TABLE>

    Thanks again.
    LC.
    Lorne Cameron, Jun 29, 2003
    #2
    1. Advertising

  3. brucie

    brucie Guest

    In post <>
    Lorne Cameron said...

    >>>with one exception: is it possible to have the content DIV fill all
    >>>remaining space vertically as well as hortizontally?>


    >> http://usenet.alt-html.org/layout-only-supported-by-opera-7-plus-thingy.html


    > I'm not sure what you're trying to illustrate here, or if you understand
    > my question. What I'm looking for is the layout equivalent to the
    > following table:


    the above centers an image (or anything else) horizontally and
    vertically within the content area (the orange bit). it is only
    supported by opera7+ (win platform).


    --
    brucie a. blackford. 29/June/2003 11:25:08 am kilo.
    http://loser.brucies.com/
    brucie, Jun 29, 2003
    #3
  4. brucie

    Wipkip Guest

    brucie wrote:

    >> It's working pretty much as I want tit now,

    > ^^^
    > you said a rude word
    >

    Which word is rude? I too want a tit now.

    --
    Duende
    -----
    What is the difference between genius and stupidity?
    Genius has limits. - Albert Einstein.
    Wipkip, Jun 29, 2003
    #4
  5. brucie wrote:
    >
    >>>>http://usenet.alt-html.org/layout-only-supported-by-opera-7-plus-thingy.html

    >
    >>the above centers an image (or anything else) horizontally and
    >>vertically within the content area (the orange bit). it is only
    >>supported by opera7+ (win platform).

    >
    >
    > a screencap:
    > http://usenet.alt-html.org/screencap-opera7.png [5.3k]
    >


    Ok, cool, that's what I'm looking to do: have the content DIV fill all
    available space both hortizontally and vertically. Is there a way to do
    this in IE/NS/Mozilla?
    Lorne Cameron, Jun 29, 2003
    #5
  6. brucie wrote:
    > In post <3efe4557$>
    > Lorne Cameron said...
    >
    >
    >>>http://usenet.alt-html.org/layout-only-supported-by-opera-7-plus-thingy.html
    >>>the above centers an image (or anything else) horizontally and vertically
    >>>within the content area (the orange bit). it is only supported by opera7+
    >>>(win platform). a screencap:
    >>>http://usenet.alt-html.org/screencap-opera7.png [5.3k]

    >
    >
    >>Ok, cool, that's what I'm looking to do: have the content DIV fill all
    >>available space both hortizontally and vertically. Is there a way to do
    >>this in IE/NS/Mozilla?

    >
    >
    > only if you change your absolute units (115px header and 160px menu)
    > to percentages or for years authors have been telling people to
    > upgrade to IE (when they really mean downgrade) so why not tell
    > everyone to upgrade to opera? it really is an upgrade.
    >


    If I change to percentages I'd have to assume a certain resolution,
    wouldn't I? I think it's more effort than it's worth if I want to get
    everything just the way I want. I think I'll keep it as simple as I can
    and compromise a little there.

    As for browsers, I've used Opera at university occasionally, but I
    prefer the feel of Mozilla to anything else. And I can pretty much
    guarantee than about 95% of peple who view my site will be using IE,
    maybe a few on Netscape, so that's what I have to design for.

    Thanks for all your help. That's the layout pretty much sorted. I'll
    have a few SSI questions no doubt once I'm finished with the layout.

    LC.
    Lorne Cameron, Jun 29, 2003
    #6
  7. brucie

    brucie Guest

    In post <3efe5523$>
    Lorne Cameron said...

    >>>Ok, cool, that's what I'm looking to do: have the content DIV fill all
    >>>available space both hortizontally and vertically. Is there a way to do
    >>>this in IE/NS/Mozilla?


    >> only if you change your absolute units (115px header and 160px menu)
    >> to percentages or for years authors have been telling people to
    >> upgrade to IE (when they really mean downgrade) so why not tell
    >> everyone to upgrade to opera? it really is an upgrade.


    > If I change to percentages I'd have to assume a certain resolution,
    > wouldn't I?


    no. percentages will allow the design to adjust to the window size.
    with a fixed height for the head and width for the menu you're unable
    to set a size for the content area to fill the remaining space because
    it could be anything. the width is easy because a block level element
    will fill the space remaining but you cant do the height.

    you can make all the sizes percentages so you know if the height of
    the header is 10% and width of the menu is 20% then the content area
    will be 90% high and 80% wide.

    i don't know why you place such great importance on having the stuff
    in the content area vertically centered when you don't even know the
    height of the visitors window to know if it will have any effect or
    not anyway. just let the content of that area work itself out. simple

    --
    brucie a. blackford. 29/June/2003 01:08:57 pm kilo.
    http://loser.brucies.com/
    brucie, Jun 29, 2003
    #7
  8. brucie

    picayunish Guest

    When Wipkip was making a web page, a :-? appears and wrote:
    > brucie wrote:
    >
    >>> It's working pretty much as I want tit now,

    >> ^^^
    >> you said a rude word
    >>

    > Which word is rude? I too want a tit now.

    ---------------------------------------^^^^
    We aren't in the army.
    --
    Edwin van der Vaart (Geen familie van....)
    http://www.semi-conductors.nl/ Links to Semiconductors sites
    (will expire at 01 Sept '03)
    http://www.semi-conductor.nl/ (under construction)
    http://members.chello.nl/e.vandervaart/ Experimental site
    http://host.deluxnetwork.com/~evdvaart/ Test site
    picayunish, Jun 29, 2003
    #8
  9. brucie

    Wipkip Guest

    William Tasso wrote:
    > Wipkip wrote:
    >> brucie wrote:
    >>>> It's working pretty much as I want tit now,
    >>> ^^^
    >>> you said a rude word
    >>>

    >> Which word is rude? I too want a tit now.

    >
    > just the one?


    You have to start somewhere.

    --
    Duende
    ------------
    If a turtle doesn't have a shell, is he/she homeless or naked?
    Wipkip, Jun 29, 2003
    #9
    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. David Graham

    Re: CSS positioning help - Mozilla

    David Graham, Jun 28, 2003, in forum: HTML
    Replies:
    1
    Views:
    5,473
    Lorne Cameron
    Jun 28, 2003
  2. Woolly Mittens
    Replies:
    8
    Views:
    417
    Woolly Mittens
    Sep 22, 2003
  3. Ilya
    Replies:
    9
    Views:
    1,796
  4. Henri
    Replies:
    9
    Views:
    1,799
    Toby Inkster
    Feb 22, 2005
  5. sagejoshua
    Replies:
    2
    Views:
    478
    sagejoshua
    Oct 10, 2005
Loading...

Share This Page