Convert absolute positioning to relative?

Discussion in 'HTML' started by Vernon Compton, Feb 28, 2004.

  1. I am almost afraid to ask this in this group, but I am keen to know if
    this is possible.

    After struggling for two weeks to use CSS and relative postioning, and
    having the results look wonky in different browsers, I have just used
    Namo WebEditor 5.5 to create a small site. The layout looks good, the
    code is a bloated mess, but the real problem is that all the layers
    are positioned absolutely. Is there a (comparatively) easy way to
    convert absolute postioning to relative?
     
    Vernon Compton, Feb 28, 2004
    #1
    1. Advertising

  2. Vernon Compton

    rf Guest

    "Vernon Compton" <> wrote in message
    news:...
    > I am almost afraid to ask this in this group, but I am keen to know if
    > this is possible.


    Don't be afraid.

    > After struggling for two weeks to use CSS and relative postioning, and
    > having the results look wonky in different browsers, I have just used
    > Namo WebEditor 5.5 to create a small site. The layout looks good, the
    > code is a bloated mess, but the real problem is that all the layers
    > are positioned absolutely. Is there a (comparatively) easy way to
    > convert absolute postioning to relative?


    You should not be using relative positioning unless you know exactly what it
    does. Go over here to the spec and have a read:
    http://www.w3.org/TR/2004/CR-CSS21-20040225/visuren.html#positioning-scheme

    Basically, relative positioning means lay the page out as per normal
    positioning and then move certain elements *relative* to where they would
    have been. I am sure this is not the way you want to lay out your page.
    Relative positioning does *not* mean position an element relative to what
    came before it.

    If you use absolute positioning then you will get into real trouble when
    your viewer changes her font size. Suddenly all your carefully positioned
    text will get bigger and overwrite what is underneath it. Changing canvas
    size also tends to be detrimental.

    The best way to lay things out is to not. Let the browser do it for you. At
    most you might want to float a div left or give something a left margin but
    that should be about all. The web is a fluid medium, not fixed like desktop
    publishing.

    Do you have a URL of your attemps for us to look at? It should take only a
    minute or so to determine the flaws in your thinking :)

    Cheers
    Richard.
     
    rf, Feb 28, 2004
    #2
    1. Advertising

  3. > Do you have a URL of your attemps for us to look at? It should take
    only a
    > minute or so to determine the flaws in your thinking :)
    >
    > Cheers
    > Richard.
    >


    The flaws in my thinking are probably too many to count, unless you use
    base googol.

    The site is now up at http://www.finepolishedconcrete.co.nz and I feel
    the need to make some disclaimers:

    It's a mess - the code is bloated, and it wouldn't come close to
    validation in a month of Sundays. However, these details are not
    important to my client, so the site serves the purpose of giving him an
    OK-looking site, that will serve while I try to teach myself what I need
    to know in order to achieve a similar look by hand-coding. That remains
    my objective, and I think I should be able to pull it off before too
    long, with the help I get from groups like this one.

    So, by all means vomit when you see the code, I nearly did, but after
    you've recovered, any pointers on how to move down the path of purity to
    reach that basic design will be gratefully received.
     
    Vernon Compton, Feb 28, 2004
    #3
  4. Vernon Compton

    rf Guest

    "Vernon Compton" <> wrote in message
    news:c1pqks$1mgqab$-berlin.de...
    > > Do you have a URL of your attemps for us to look at? It should take

    > only a
    > > minute or so to determine the flaws in your thinking :)
    > >
    > > Cheers
    > > Richard.
    > >

    >
    > The flaws in my thinking are probably too many to count, unless you use
    > base googol.
    >
    > The site is now up at http://www.finepolishedconcrete.co.nz and I feel
    > the need to make some disclaimers:
    >
    > It's a mess - the code is bloated, and it wouldn't come close to
    > validation in a month of Sundays. However, these details are not
    > important to my client, so the site serves the purpose of giving him an
    > OK-looking site, that will serve while I try to teach myself what I need
    > to know in order to achieve a similar look by hand-coding. That remains
    > my objective, and I think I should be able to pull it off before too
    > long, with the help I get from groups like this one.
    >
    > So, by all means vomit when you see the code, I nearly did, but after
    > you've recovered, any pointers on how to move down the path of purity to
    > reach that basic design will be gratefully received.
    >


    Ouch. Flaws detected :)

    Ditch Namo. Right now.

    Start again from scratch.



    Really.



    I looked at you opening page and thought... Hmmm, yes, this has been
    produced by a so called wysiwyg. Then I looked at the code...Aaarrrgggg.

    Hmmm. How to start... Well, for a start just simply open notepad or whatever
    and type in your content. Then type in the <img> elements that you require.
    Then type in the <ol> element for your navigation, with the appropriate <a>
    elements. Use CSS to add flavour to taste.

    The whole page will be about 100 lines, not the thousands Nemo has burped
    out for you.

    BTW loose ALL of that javascript (Nemo generated I presume). It is not
    required. Loose the nasty backgrounds under your nav buttons, the ones that
    make the text unreadable. Then again don't use images at all, use CSS to
    flavour the buttons.

    Use black text on white. White on black is hard to read and went out of
    vouge when MS/DOS was superseded.

    At the moment your page looks just like most of the other 100 million pages
    out there. With a little work on your part and references back here for
    critique it can become one of the few thousands :)

    As to your positioning, here is an example of what I spoke about previously:

    http://users.bigpond.net.au/rf/test/concrete.jpg

    Cheers
    Richard.
     
    rf, Feb 28, 2004
    #4
  5. Vernon Compton

    Adrian Wood Guest

    "rf" <> wrote in message
    news:4J%%b.80306$...

    > Use black text on white. White on black is hard to read and went out of
    > vouge when MS/DOS was superseded.


    Not 100% certain I agree here. People often forget that a monitor isn't a
    piece of paper, and a looking at a mainly white screen is like staring at a
    lightbulb; a black background, when done right, can make the whole thing a
    lot easier on the eyes, which is important for anyone using the computer for
    more than half an hour or so at a time.

    Supposedly, yellow on black is easiest to read without killing the eyeballs.

    --
    Adrian
     
    Adrian Wood, Mar 1, 2004
    #5
  6. Adrian Wood wrote:
    > ...
    > Supposedly, yellow on black is easiest to read without killing the
    > eyeballs.


    interesting - do you have references to support that?

    --
    William Tasso
     
    William Tasso, Mar 1, 2004
    #6
  7. Vernon Compton

    Sharon Guest

    Re: Convert absolute positioning to relative - Visusal Impairments

    > > Use black text on white. White on black is hard to read and went out of
    > > vouge when MS/DOS was superseded.

    > Not 100% certain I agree here. People often forget that a monitor isn't a
    > piece of paper, and a looking at a mainly white screen is like staring at

    a
    > lightbulb; a black background, when done right, can make the whole thing a
    > lot easier on the eyes, which is important for anyone using the computer

    for
    > more than half an hour or so at a time.
    > Supposedly, yellow on black is easiest to read without killing the

    eyeballs.

    I wanted to ask others what they have read or heard about website
    presentation and the visual impaired. I have several people on my cancer
    group who are not blind, therefore they do not have a reader. Their sight
    is impaired, so they need to expand my pages into large text. I was always
    told that a white background is easier on the visually impaired. Does
    anyone here have information about this topic?

    Take Care, Sharon
     
    Sharon, Mar 1, 2004
    #7
  8. Adrian Wood wrote:

    > Supposedly, yellow on black is easiest to read without killing the eyeballs.


    From what I've heard, this depends muchly on the environment.

    In dark rooms, amber on black and green on black are very readable. This
    is why you'll find most text terminals and older PCs default to these
    colours.

    In light offices, black on off-white is the way to go.

    If in doubt, offer your users the choice. :)

    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
     
    Toby A Inkster, Mar 1, 2004
    #8
  9. Vernon Compton

    Mark Parnell Guest

    On Mon, 01 Mar 2004 18:38:14 +0000, Toby A Inkster
    <> declared in
    alt.html,alt.html.webedit:

    > In light offices, black on off-white is the way to go.


    I have my system set to black on yellow, and I find it quite good. :)

    --
    Mark Parnell
    http://www.clarkecomputers.com.au
     
    Mark Parnell, Mar 1, 2004
    #9
  10. Vernon Compton

    Sid Ismail Guest

    On Tue, 2 Mar 2004 08:50:49 +1100, Mark Parnell
    <> wrote:

    : On Mon, 01 Mar 2004 18:38:14 +0000, Toby A Inkster
    : <> declared in
    : alt.html,alt.html.webedit:
    :
    : > In light offices, black on off-white is the way to go.
    :
    : I have my system set to black on yellow, and I find it quite good. :)


    Mine's black on very light blue (F0F9FF). Also nice to the eye.

    Sid
     
    Sid Ismail, Mar 2, 2004
    #10
  11. Vernon Compton

    Adrian Wood Guest

    "William Tasso" <> wrote in message
    news:c1vdsm$1nipgn$-berlin.de...
    > Adrian Wood wrote:
    > > ...
    > > Supposedly, yellow on black is easiest to read without killing the
    > > eyeballs.

    >
    > interesting - do you have references to support that?


    I actually didn't, it's just something I'd heard a few times... so, I
    embarked upon a none-epic journey of the web in search of answers.

    http://maddox.xmission.org/c.cgi?u=faq
    "your monitor is not a piece of paper, no matter how hard you try to make it
    one."

    http://www.webwhirlers.com/colors/combining.asp
    "Black text on a white background has the highest readability. Black and
    yellow is another combination which usually has a high readability"

    http://www.gremlins.com/donal_buckley/oils.html
    "The two most visually complementary colour from a human vision standpoint
    are black and yellow."

    http://www.tinhat.com/usability/colour.html
    "I've recently heard an optician say that full 100% contrast is not the
    easiest for people to read, and black text on a coloured background is
    significantly easier"

    Seems like it's a good idea to use yellow with black, but it's OK whether
    you choose to use yellow as the font or backing colour. Personally, I just
    try to keep the screen as dark overall as realistically possible, but that's
    just me!

    Incidentally, I might as well spin this off as a quick query; I have a
    mobile-optimised website that I've designed to be as simple and compatible
    as possible, so I've avoided any changes of colouring. Does anyone know if
    there's even a remote possibility that it might break compatibility with
    certain browsers if I do change the colour scheme?
    http://www.shellprompt.co.uk/~slayer/index.html For reference. (My first
    website, so forgive me if it doesn't match up with how it should be done!)

    --
    Adrian
     
    Adrian Wood, Mar 2, 2004
    #11
    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. Rob R. Ainscough
    Replies:
    2
    Views:
    1,670
    Rob R. Ainscough
    Feb 7, 2006
  2. Fred Nelson
    Replies:
    1
    Views:
    2,470
    Christopher Reed
    Feb 21, 2006
  3. Chris
    Replies:
    10
    Views:
    1,101
    Chris
    Mar 1, 2004
  4. Sentient Fluid

    Absolute/relative positioning of div's

    Sentient Fluid, Sep 1, 2004, in forum: HTML
    Replies:
    6
    Views:
    824
    Sentient Fluid
    Sep 4, 2004
  5. KatB
    Replies:
    8
    Views:
    4,195
Loading...

Share This Page