SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2000
    Location
    Somewhere
    Posts
    81
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    Could someone explain to me how to the top 100 pixels of your background one color, and the rest of the background a different color using CSS.


    Thanks

  2. #2
    Your Lord and Master, Foamy gold trophy Hierophant's Avatar
    Join Date
    Aug 1999
    Location
    Lancaster, Ca. USA
    Posts
    12,305
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    The easiest way in Netscape 6 and IE 4+ is to make a background graphic that is the color you want and put the following code in Style Sheet.

    body {
    background-position : top;
    background-repeat : repeat-x;
    background-image : url(/path2/image.gif);
    }

    I am not sure about the following and it is a more complicated way but a way that could work in Netscape 4.X as well would be:
    Code:
    <head>
    <style>
    .topcolor {
      position:absolute;
      height:100;
      width:100%;
      left:0;
      top:0;
      clip:rect(0,100%,100,0); 
      background-color: #983274;
      color:#983274
      z-index: -1;
    }
    
    .content {
      position:absolute;
      top:0;
      left:0;
    }
    </style>
    </head>
    <body>
    <div class="topcolor">&nbsp;This is my top background color</div>
    <div class="content">Your Page content here </div>
    </body>
    Wayne Luke
    ------------


  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2000
    Location
    Somewhere
    Posts
    81
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    thanks

    thanks


Bookmarks

Posting Permissions

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