Results 1 to 4 of 4

Thread: Css full page background

  1. #1
    Join Date
    Jul 2011
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Red face Css full page background

    Hi guys !
    I need your help please (important !)
    I'd like to use a speaker grill background on my website,I've tried hardly to make it fit the screen but I still can't do it .
    This is the code i use

    Code:
    .BG_Null
    {
    }
    .BG_Base
    {
    	background-color:#436C99;
    }
    .BG_VeryLight
    {
    	background-color:#ffffff;
    }
    .BG_Light
    {
    	background-color:#ffffff;
    }
    .BG_Mid
    {
    	background-color:#638CBB;
    }
    .BG_Dark
    {
    	background-image:url(http://freephotoshopdownload.net/wp-...ground-Set.png);
    }
    .BG_VeryDark
    {
    	background-color:#000000;
    }
    
    
    
    .F_VeryLight
    {
    	color:#ffffff;
    }
    .F_Light
    {
    	color:#ffffff;
    }
    .F_Mid
    {
    	color:#638CBB;
    }
    .F_Dark
    {
    	color:#000000;
    }
    .F_VeryDark
    {
    	color:#000000;
    }
       
    
    body
    {
    	text-align:Center;
    	background-image: url(http://farm4.static.flickr.com/3377/...8fec846d_o.jpg);
                     
              
    	font-family:'Courier New', monospace;
    	font-size:10pt;
    	color:#000000;
    }
    
    
    
    
    .MS_MasterFrame
    {
    	margin-left:auto;
    	margin-right:auto;
    }
    
    
    td, th
    {
      font-family:'Courier New', monospace;
      font-size:10pt;
    }
    
    
    .MS_MasterFrame
    {
    	width:980px;
     
    }
       
    .MSC_SiteWidth,.MS_MasterHeader,.MS_MasterGlobalLinks,.MS_MasterPrimaryNav,.MS_MasterFooter,.MS_MasterTopAD,.MS_MasterBottomAD
    {
    	width:100%;
                     
    }
    
    
    
    .MSC_HeaderFrame
    {
    	background-color:000000;
    	width:100%;
     
    }
    
    .MSC_HeaderDescription
    {
    	font-size:12px;
    	margin:0px;
    }
    PLEASE HELP ME !!
    Last edited by jscheuer1; 09-24-2011 at 08:20 AM. Reason: format code

  2. #2
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    693
    Thanks
    1
    Thanked 113 Times in 111 Posts

    Default

    Hi there Godji,

    check out the attachment to see my humble attempt.

    coothead

  3. #3
    Join Date
    Jul 2011
    Posts
    8
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Lol That's interesting !! I'll try it that way. But why if I want to use another image where I can't crop it,like a photo of a group of person ? Thanks for your attemp,I really apreciate it.

    Take a look on my website http://isakpase.com/default.aspx
    Last edited by jscheuer1; 09-24-2011 at 03:28 PM. Reason: merge posts

  4. #4
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    693
    Thanks
    1
    Thanked 113 Times in 111 Posts

    Default

    Hi there Godji,

    here is an example that uses CSS3 background-size and will work in modern browsers...
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    <base href="http://killmydaynow.com/wp-content/uploads/2010/07/WeirdandStrangePeople42PICS_13710/">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title>stretched background image</title>
    
    <style type="text/css">
    html,body {
        margin:0;
        padding:0;
        height:100%;
        background-image:url(WierdandStrangePeople_1.jpg);
        background-size:100% 100%;
     }
    </style>
    
    </head>
    <body>
    
    <div></div>
    
    </body>
    </html>
    
    coothead

  5. The Following User Says Thank You to coothead For This Useful Post:

    Godji (09-25-2011)

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
  •