www.webdeveloper.com
Results 1 to 3 of 3

Thread: Background position...

  1. #1
    Join Date
    Jul 2004
    Location
    Newcastle upon Tyne
    Posts
    116

    Background position...

    Hi people,

    I am creating a fluid layout and i m having trouble with back-ground positioning.

    The site needs to look liek three columns- center is white sides are this (hideous) red effort.

    here is what i have at the moment but the background position is not working with % - only px

    html
    {
    height: 101%;
    margin: 0;
    padding: 0;
    width: 100%;
    background: #ea0437 url(../images/bgwhite.jpg) repeat-y 30% 0;
    }

    body
    {
    background: transparent url(../images/bgred.gif) repeat-y 70% 0;
    color: #fff;
    margin: 0;
    padding: 0;
    font-family: Lucida Sans, Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    height: 100%;
    }

    Any help will be very much appreciated...

  2. #2
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    background: #ea0437 url(../images/bgwhite.jpg) repeat-y 30% 0

    -I thought that the default values for postion were:
    top, center, bottom for x and left, center, and right for y, -but it seems as if I have also seen percentages used. So, is their need for including the "attachement" value to get percentage to work, e.g.,:

    background: #ea0437 url(../images/bgwhite.jpg) repeat-y fixed 30% 0

    (whereby the attachment value could be fixed, scroll or inherit)
    Last edited by WebJoel; 02-08-2007 at 07:59 AM.
    I build for: Firefox and tweak for IE

  3. #3
    Join Date
    Feb 2007
    Location
    Philippines
    Posts
    57
    Do you have a working/live sample page w/ the codes you specified?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles