What's happening with this?

Discussion in 'HTML' started by Frogleg, Aug 4, 2004.

  1. Frogleg

    Frogleg Guest

    Frogleg, Aug 4, 2004
    #1
    1. Advertising

  2. Frogleg

    Sam Hughes Guest

    Frogleg <> wrote in
    news::

    > If I resize the window down in IE, the 2nd column drops to a level
    > below the 1st column. This doesn't happen in Firefox. What am I doing
    > wrong?
    >
    > http://home.earthlink.net/~absolutelyfake/problem.htm


    When IE sees that the content div does not fit horizontally in the
    window, it decides that the content div should be wrapped so that it lies
    beneath your floated menu. However, its left margin is set at 225px, so
    it remains off the screen, just pushed down so that it clears the
    floating box on its left.

    In my opinion, what you are doing wrong is namely using pixels for widths
    of margins and content areas. However, while using relative sizes will
    improve your karma, it won't fix the bug you have been experiencing. To
    fix that, you need to remove the width restriction on the content div.

    By the way, while looking at your CSS, I noticed that you have a menu
    class set up for A elements that I presume would be in your #menu div.
    However, instead of creating a new class, you could just use:

    #menu a:link { ... }

    in place of

    a.menu:link { ... }

    And likewise for :visited/:hover. Now you don't have to have a class
    attribute for all those start tags.

    --
    Accessible web designs go easily unnoticed;
    the others are remembered and avoided forever.
    Sam Hughes, Aug 5, 2004
    #2
    1. Advertising

  3. Frogleg

    Frogleg Guest

    On 5 Aug 2004 15:10:41 GMT, Sam Hughes <> wrote:

    >Frogleg <> wrote
    >
    >> If I resize the window down in IE, the 2nd column drops to a level
    >> below the 1st column. This doesn't happen in Firefox. What am I doing
    >> wrong?
    >>
    >> http://home.earthlink.net/~absolutelyfake/problem.htm

    >
    >When IE sees that the content div does not fit horizontally in the
    >window, it decides that the content div should be wrapped so that it lies
    >beneath your floated menu. However, its left margin is set at 225px, so
    >it remains off the screen, just pushed down so that it clears the
    >floating box on its left.
    >
    >In my opinion, what you are doing wrong is namely using pixels for widths
    >of margins and content areas. However, while using relative sizes will
    >improve your karma, it won't fix the bug you have been experiencing. To
    >fix that, you need to remove the width restriction on the content div.
    >
    >By the way, while looking at your CSS, I noticed that you have a menu
    >class set up for A elements that I presume would be in your #menu div.
    >However, instead of creating a new class, you could just use:
    >
    >#menu a:link { ... }
    >
    >in place of
    >
    >a.menu:link { ... }


    Thanks. I usually get an answer here within minutes -- often before I
    post if Brucie's awake -- and was becoming panicky.

    I specified pixel widths because the 'real' page involves several
    graphics. 20% of 800 puts things in a completely different place than
    20% of 1280.

    I'm just creeping up on CSS, and *knew* I had redundant/clumsy 'menu'
    stuff. I'm wobbly on syntax, and my comprehensive reference book is
    too big to have in my computer area. Relying on "read...remember" is
    chancy. Thanks for the bonus info.

    I'm becoming somewhat disenchanted with CSS. While it can really do
    some nifty things, there seem to be a lot of bottom-of-the-page notes
    with "this problem affects Opera in some cases..." and "might make
    some IE layouts look a bit odd...." At least with tables, things
    more or less stay where you put them. And tutorials have few footnotes
    about which browsers are incompatible with them. :)
    Frogleg, Aug 6, 2004
    #3
  4. Frogleg

    rf Guest

    Frogleg wrote

    > I'm becoming somewhat disenchanted with CSS.


    Possibly because of where you are coming from :)

    By this I mean coming from a "table based" design philosophy.

    Table based design usually implies putting things exactly here or there and
    specifying the dimensions of things all over the place and stictly having
    things here or there in relation to each other, usually to the nearest pixel
    and preferably looking exactly the same in all browsers.

    CSS is all about writing the content first (the HTML bit) and applying
    styles to the HTML elements afterwards, to tart up that content.

    Well, not strictly true but do not fall into the trap of thinking "I need a
    box this big here and another one this big over there".

    Think more like "here is a block of content (a menu) and here is another
    block of content (the "content")". Right, I have them, they are written.
    Now, how would I like to present (read position) these today?

    You are trying to make CSS do too much. CSS is not about desktop publishing,
    it is about making the content of a web page present nicely. Nicely on this
    browser, nicely on that one, perhaps not the same but nicely. Even nicely on
    things such as lynx.

    Look at
    http://users.bigpond.net.au/rf/frogleg/index.htm
    css at
    view-source:http://users.bigpond.net.au/rf/frogleg/problem.css

    Flows. The CSS was definitely added after the event.

    Now look at
    http://users.bigpond.net.au/rf/frogleg/index1.htm
    css at
    view-source:http://users.bigpond.net.au/rf/frogleg/problem1.css

    Verify that the only thing that has changed is the CSS (plus, of course, the
    link to it).

    I can totally rewrite the CSS file and cause the page to look totally
    different. This is because I have totally seperated the presentation from
    the content. I have also seperated *thinking* about the presentation from
    *thinking* about the content.

    CSS is Content, then presentation.

    Tables are presentation, then content, IMHO a bad way of thinking about web
    page design.

    --
    Cheers
    Richard.
    rf, Aug 6, 2004
    #4
  5. Frogleg

    Frogleg Guest

    On Fri, 06 Aug 2004 10:43:11 GMT, "rf" <rf@.invalid> wrote:

    >Frogleg wrote
    >
    >> I'm becoming somewhat disenchanted with CSS.


    > do not fall into the trap of thinking "I need a
    >box this big here and another one this big over there".


    Yeah, but..
    Even if I couldn't do this with vanilla HTML and tables, I was
    confident that such layout I *could* achieve would stay put. Indeed,
    my 'tabled' pages required little fiddling for display at different
    resolutions and with different browsers. It was easy to avoid
    specifying exact sizes or positions, and absent large graphics,
    everything "collapsed" rather nicely.

    Now, after being promised vastly improved control over layout and
    near-infinite flexibility, I am (and others are, to judge by posts
    here) finding that *this* won't work in IE and *that* goes wonky in
    Mozilla and some other thing may or may not go completely pear-shaped
    in differing resolutions. 3X the scope in exchange for 5X the work.

    >Look at
    >http://users.bigpond.net.au/rf/frogleg/index.htm
    >css at
    >view-source:http://users.bigpond.net.au/rf/frogleg/problem.css
    >
    >Flows. The CSS was definitely added after the event.


    Thanks. I've just looked and saved. Will study offline.
    >
    >Now look at
    >http://users.bigpond.net.au/rf/frogleg/index1.htm
    >css at
    >view-source:http://users.bigpond.net.au/rf/frogleg/problem1.css


    Umm. Because I wanted to get my specific problem visible ASAP, I
    stripped the page of non-problem info. It's really rather attractive
    and sophisticated with graphics in IE6.0.2008 at 800x600. :)
    >
    >Verify that the only thing that has changed is the CSS (plus, of course, the
    >link to it).
    >
    >I can totally rewrite the CSS file and cause the page to look totally
    >different. This is because I have totally seperated the presentation from
    >the content. I have also seperated *thinking* about the presentation from
    >*thinking* about the content.


    I've been to the CSS Zen Garden. :) I'm *so* not in that class. So
    to speak. As it were.

    Thanks again for the examples. I'll get it right eventually.
    Frogleg, Aug 6, 2004
    #5
  6. Frogleg

    rf Guest

    Frogleg wrote
    > On Fri, 06 Aug 2004 10:43:11 GMT, "rf" <rf@.invalid> wrote:
    >
    > >Frogleg wrote
    > >
    > >> I'm becoming somewhat disenchanted with CSS.

    >
    > > do not fall into the trap of thinking "I need a
    > >box this big here and another one this big over there".

    >
    > Yeah, but..
    > Even if I couldn't do this with vanilla HTML and tables, I was
    > confident that such layout I *could* achieve would stay put.


    CSS layout does *not* stay put. That is the best thing about it. It allows
    the page to adapt to the viewers environment. If you want something to "stay
    put" then consider using a huge gif :)

    > Indeed,
    > my 'tabled' pages required little fiddling for display at different
    > resolutions


    Different "resolutions" are irrelevant. What you really mean is screen size
    and how do you know how big your viewers screen is. For example most of my
    "screens" are 1600x1200 pixels. My "desktop" is (currently) 4800x1200
    pixels. It might (as it was yesterday) be 1600x2400 pixels.

    Resolution is Irrelevant.

    Besides, your viewers canvas size is never equal to their "resolution". It
    is the canvas size you should worry about but then you should not even
    worry about that. You have no control over it so you should design to any
    size canvas.

    > and with different browsers.


    This been discussed before. Refer to the archive. To summarize different
    browsers are irrelevant. As irrelevant as canvas size. Your page will
    *never* look the same in two or more different browsers. That is why there
    *are* two or more different browsers.

    > It was easy to avoid
    > specifying exact sizes or positions, and absent large graphics,
    > everything "collapsed" rather nicely.


    So why are you trying to "position" things? Let them flow. Let them degrade
    gracefully. Don't anticipate a "size", use the browsers layout capabilities.

    > Now, after being promised vastly improved control over layout and
    > near-infinite flexibility, I am (and others are, to judge by posts
    > here) finding that *this* won't work in IE and *that* goes wonky in
    > Mozilla and some other thing may or may not go completely pear-shaped
    > in differing resolutions. 3X the scope in exchange for 5X the work.


    I repeat what I said before, you are trying too hard. Lean back a bit from
    your "it must go here" attitude and let the browser lay it out for you. It
    can, you know.

    > >Look at[...]


    > Thanks. I've just looked and saved. Will study offline.


    ....

    > Umm. Because I wanted to get my specific problem visible ASAP,


    ASAP does not count in usenet :)

    > I
    > stripped the page of non-problem info. It's really rather attractive
    > and sophisticated with graphics in IE6.0.2008 at 800x600. :)


    Then provide a URL to this page you have a problem with. I'm sure one of us
    could "CSS" it quite readily :)

    (probably not me, I'm going to the snow in only two sleeps time :) )

    And once again you are quoting things like IE and <shudder> 2008</shudder>.
    What if I use 2009? And there it is again: 800x600. This window that I am
    typing into now is er, 945x1045. The browser I am using to look at
    something, over there --> is, er, whatever... It does not matter to me, it
    should not matter to you.

    > Thanks again for the examples. I'll get it right eventually.


    I'm sure you will ;-)

    Take the time to "unlearn" the bad habbits (not a slur on you, just a
    general observation) you have grown into with your existing design skills.
    This is what I will be spending my time on next week, teaching people, my
    friends, how to ski, how to ski well, hopefully very well. This is what I do
    when I go to the snow, being a ski instructor :)

    The major effort is to stop the student from using the incorrect reflexes
    they have grown into. Then we can start working on a more correct set of
    reflexes that allow us to turn (and therefore ski) more elegantly.

    --
    Cheers
    Richard.
    rf, Aug 6, 2004
    #6
  7. Frogleg

    Webcastmaker Guest

    In article <3hJQc.36096$>,
    rf@.invalid says...
    > Well, not strictly true but do not fall into the trap of thinking "I need a
    > box this big here and another one this big over there".


    You point out the difference between 2 different Web design
    methodologies. (Neither mutually exclusive of the other, and neither
    more accessible than the other if both are done right) Some web
    developers believe that a web page is best served when you place this
    big box over here and that big box over there.

    Just 2 different thoughts about what makes the web tick.
    --
    WebcastMaker
    The easiest and most affordable way to create
    Web casts, or put presentations on the Web.
    www.webentations.com
    Webcastmaker, Aug 6, 2004
    #7
  8. Frogleg

    Frogleg Guest

    Frogleg, Aug 7, 2004
    #8
  9. Frogleg

    Frogleg Guest

    Frogleg, Aug 7, 2004
    #9
  10. Frogleg

    Mark Parnell Guest

    On Sat, 07 Aug 2004 11:22:32 GMT, Frogleg <> declared
    in alt.html:

    > What's the CSS for inserting spaces/line-breaks?


    Line breaks are content, and therefore nothing to do with CSS. As for
    "spaces", perhaps padding and/or margins may be what you are looking
    for, but it depends on the context.

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
    "Never drink rum&coke whilst reading usenet" - rf 2004
    Mark Parnell, Aug 9, 2004
    #10
    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. raj

    Upload not happening!

    raj, Jul 16, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    336
    Joerg Jooss
    Jul 20, 2003
  2. Curt_C [MVP]

    Page_Load stopped happening???

    Curt_C [MVP], Jan 15, 2004, in forum: ASP .Net
    Replies:
    4
    Views:
    311
    John Spiegel
    Jan 15, 2004
  3. msnews.microsoft.com

    How do I show an error happening in Application_Start ?

    msnews.microsoft.com, Jan 31, 2005, in forum: ASP .Net
    Replies:
    3
    Views:
    1,777
    Scott Allen
    Jan 31, 2005
  4. Chris Simmons
    Replies:
    1
    Views:
    2,544
    bruce barker
    Feb 1, 2005
  5. Wayne  Wengert

    Refresh Not Happening

    Wayne Wengert, Feb 23, 2005, in forum: ASP .Net
    Replies:
    6
    Views:
    1,382
    Wayne Wengert
    Feb 25, 2005
Loading...

Share This Page