background image position

Discussion in 'HTML' started by David Graham, Mar 4, 2006.

  1. David Graham

    David Graham Guest

    http://www.alistapart.com/articles/fauxcolumns/

    At the site above it says this:

    "The 50% 0 bit refers to the positioning of the background image - in this
    case, 50% from the left side of the browser window (resulting in a centered
    image)"

    I thought this would move the image over 50% from the left edge, resulting
    in no image being present down the left half of the screen. Please could
    someone explain what this excellent web site means by 50%

    bye
    David
    David Graham, Mar 4, 2006
    #1
    1. Advertising

  2. David Graham wrote:

    > "The 50% 0 bit refers to the positioning of the background image


    > I thought this would move the image over 50% from the left edge, resulting
    > in no image being present down the left half of the screen.


    No. It puts the point $x% along the image $x% along the horizontal length of
    the container. So 100% would put the right hand edge of the image along the
    right hand edge of the container. 10% would put the put 10% along the image
    10% along the container. And so on.

    --
    David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
    Home is where the ~/.bashrc is
    David Dorward, Mar 4, 2006
    #2
    1. Advertising

  3. David Graham

    David Graham Guest

    "David Dorward" <> wrote in message
    news:dubq4k$f33$1$...
    > David Graham wrote:
    >
    > > "The 50% 0 bit refers to the positioning of the background image

    >
    > > I thought this would move the image over 50% from the left edge,

    resulting
    > > in no image being present down the left half of the screen.

    >
    > No. It puts the point $x% along the image $x% along the horizontal length

    of
    > the container. So 100% would put the right hand edge of the image along

    the
    > right hand edge of the container. 10% would put the put 10% along the

    image
    > 10% along the container. And so on.
    >

    Thanks for that
    So, 0% would put the left edge of the image on the left side of the
    container. No need to confirm I'm sure that is correct from what you say.
    bye
    David
    David Graham, Mar 4, 2006
    #3
  4. David Graham

    David Graham Guest

    "David Dorward" <> wrote in message
    news:dubq4k$f33$1$...
    > David Graham wrote:
    >
    > > "The 50% 0 bit refers to the positioning of the background image

    >
    > > I thought this would move the image over 50% from the left edge,

    resulting
    > > in no image being present down the left half of the screen.

    >
    > No. It puts the point $x% along the image $x% along the horizontal length

    of
    > the container. So 100% would put the right hand edge of the image along

    the
    > right hand edge of the container. 10% would put the put 10% along the

    image
    > 10% along the container. And so on.
    >

    One more thing comes to mind, if the background image is wider than the
    container - lets say the screen resolution is 800px maximised and the image
    is 1200px wide, would a 50% 0 image have its extreme left and right sides
    cropped in a symmetrical fashion, or would the image shrink itself to
    display all the image inside the container.
    bye
    David
    David Graham, Mar 4, 2006
    #4
  5. David Graham

    kchayka Guest

    David Graham wrote:
    > http://www.alistapart.com/articles/fauxcolumns/
    >
    > "The 50% 0 bit refers to the positioning of the background image
    >
    > someone explain what this excellent web site means by 50%


    Why don't you go read the specs and find out for yourself?
    <URL:http://www.w3.org/TR/CSS21/colors.html#propdef-background-position>

    --
    Reply email address is a bottomless spam bucket.
    Please reply to the group so everyone can share.
    kchayka, Mar 4, 2006
    #5
  6. David Graham

    kchayka Guest

    David Graham wrote:
    >
    > if the background image is wider than the container
    > would the image shrink itself to
    > display all the image inside the container.


    Why don't you just try it and see for yourself?

    --
    Reply email address is a bottomless spam bucket.
    Please reply to the group so everyone can share.
    kchayka, Mar 4, 2006
    #6
  7. David Graham

    David Graham Guest

    "kchayka" <> wrote in message
    news:...
    > David Graham wrote:
    > > http://www.alistapart.com/articles/fauxcolumns/
    > >
    > > "The 50% 0 bit refers to the positioning of the background image
    > >
    > > someone explain what this excellent web site means by 50%

    >
    > Why don't you go read the specs and find out for yourself?
    > <URL:http://www.w3.org/TR/CSS21/colors.html#propdef-background-position>
    >

    Your quite correct of course, but the specs don't make things as clear and
    easy to understand as the experts in this group do. There's nothing like a
    reply that gets straight to the hub of the problem.
    bye
    David
    David Graham, Mar 5, 2006
    #7
  8. David Graham

    dorayme Guest

    In article <h9BOf.27238$>,
    "David Graham" <> wrote:

    > "kchayka" <> wrote in message
    > news:...
    > > David Graham wrote:
    > > > http://www.alistapart.com/articles/fauxcolumns/
    > > >
    > > > "The 50% 0 bit refers to the positioning of the background image
    > > >
    > > > someone explain what this excellent web site means by 50%

    > >
    > > Why don't you go read the specs and find out for yourself?
    > > <URL:http://www.w3.org/TR/CSS21/colors.html#propdef-background-position>
    > >

    > Your quite correct of course, but the specs don't make things as clear and
    > easy to understand as the experts in this group do. There's nothing like a
    > reply that gets straight to the hub of the problem.
    > bye
    > David


    A good answer, David. I have a whole book on CSS that is no
    better than http://www.w3.org/TR/CSS2... Many folk (including old
    kchayka!) are much better at explaining things when they are in a
    mood to do so...

    --
    dorayme
    dorayme, Mar 5, 2006
    #8
  9. David Graham

    kchayka Guest

    David Graham wrote:
    > "kchayka" <> wrote in message
    > news:...
    >>
    >> Why don't you go read the specs and find out for yourself?
    >>

    > There's nothing like a
    > reply that gets straight to the hub of the problem.


    Um, I did on-call support for more than 15 years. There was nothing that
    irked me more than when somebody paged me for something that was easily
    found in the manual. They usually said it was easier just to bother the
    expert rather than look it up. I'm sure I am not the only person who
    gets pretty annoyed by something like this.

    RTFM first. If need be, ask about the parts you don't understand. In the
    case of background images in CSS, it probably would have taken you 10
    minutes to make up a test case that would have answered your own questions.

    Make an effort to help yourself, eh?

    --
    Reply email address is a bottomless spam bucket.
    Please reply to the group so everyone can share.
    kchayka, Mar 6, 2006
    #9
  10. David Graham

    David Graham Guest

    "kchayka" <> wrote in message
    news:...
    > David Graham wrote:
    > > "kchayka" <> wrote in message
    > > news:...
    > >>
    > >> Why don't you go read the specs and find out for yourself?
    > >>

    > > There's nothing like a
    > > reply that gets straight to the hub of the problem.

    >
    > Um, I did on-call support for more than 15 years. There was nothing that
    > irked me more than when somebody paged me for something that was easily
    > found in the manual. They usually said it was easier just to bother the
    > expert rather than look it up. I'm sure I am not the only person who
    > gets pretty annoyed by something like this.
    >
    > RTFM first. If need be, ask about the parts you don't understand. In the
    > case of background images in CSS, it probably would have taken you 10
    > minutes to make up a test case that would have answered your own

    questions.
    >
    > Make an effort to help yourself, eh?
    >

    Ok - help here is so freely given usually that it can make one lazy. Yes, I
    can make a test case and will do so, but I do enjoy posting questions
    because so often I have benefited by the throw away replies that experts add
    to even straight forward questions. Sometimes I get more out of the
    off-shoots from a posting than the primary answer. However, I will try to be
    more self-reliant in future. I consider myself properly ticked off.
    bye
    --
    David
    David Graham, Mar 6, 2006
    #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. Werner Reiter

    Position of a table background image

    Werner Reiter, Dec 25, 2004, in forum: HTML
    Replies:
    1
    Views:
    540
    Erik Ginnerskov
    Dec 25, 2004
  2. Leupi
    Replies:
    2
    Views:
    417
    Leupi
    Mar 3, 2008
  3. jc
    Replies:
    3
    Views:
    1,703
  4. jc
    Replies:
    1
    Views:
    1,338
    Neredbojias
    Mar 19, 2008
  5. Dj Frenzy
    Replies:
    3
    Views:
    282
    Robert
    Feb 10, 2004
Loading...

Share This Page