Split background color?

Discussion in 'HTML & Website Design' started by ab420, Sep 7, 2007.

  1. #1
    I would like to have the background be black on the left, and white on the right, is that possible?

    Thanks in advance.
     
    ab420, Sep 7, 2007 IP
  2. eruct

    eruct Well-Known Member

    Messages:
    1,189
    Likes Received:
    49
    Best Answers:
    0
    Trophy Points:
    108
    #2
    Sure. Why not just use an image? Make something that is like 1px high, black on the left, white on the right and have it repeat on the y-axis.
     
    eruct, Sep 7, 2007 IP
  3. twistedspikes

    twistedspikes Notable Member

    Messages:
    5,694
    Likes Received:
    293
    Best Answers:
    0
    Trophy Points:
    280
    #3
    Then if someone has a massive screen then they won't see it properly.

    e.g if you made the image 1024px wide then people with bigger monitors will just see the normal bg colour at the sides
     
    twistedspikes, Sep 7, 2007 IP
  4. Scorpiono

    Scorpiono Well-Known Member

    Messages:
    1,330
    Likes Received:
    35
    Best Answers:
    0
    Trophy Points:
    120
    #4
    You can do this by using 2 divs that float left and right, each with his own 50% of width and specific color. Using absolute on those divs might help as well, since you'll only use them to color your background.

    If this helped, rep me!
    Scorpiono ;)
     
    Scorpiono, Sep 7, 2007 IP
  5. twistedspikes

    twistedspikes Notable Member

    Messages:
    5,694
    Likes Received:
    293
    Best Answers:
    0
    Trophy Points:
    280
    #5
    yeah, 2 divs would work:

    <div style="left:0%; height:100%; width:50%; position:absolute; z-index:0;"></div>
    <div style="left:50%; height:100%; width:50%; position:absolute; z-index:0;"></div>

    should work fine if your not bothered about having empty divs.
     
    twistedspikes, Sep 7, 2007 IP
  6. krt

    krt Well-Known Member

    Messages:
    829
    Likes Received:
    38
    Best Answers:
    0
    Trophy Points:
    120
    #6
    That won't make the layers have 100% height, percentage height is relative to the height of the parent, <body>, which has a height that is only as large as needed based on the content of the page.

    http://www.google.com/search?q=100%+height
     
    krt, Sep 7, 2007 IP
  7. mdvaden

    mdvaden Active Member

    Messages:
    465
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    58
    #7
    Is there a code that will center the background image?

    So even if its 3000 pixels wide with 1500 white and 1500 black, it still centers and splits the color?
     
    mdvaden, Sep 8, 2007 IP