Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jan 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to make a left and right background separate from middle


    i need a background like this: http://www.auctionstealth.com/

    how it is different in the middle, but a background on the sides.

    Anyone know the code for this?

    Thanks in advance!

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,710
    Thanks
    0
    Thanked 237 Times in 232 Posts
    Hi there yellow0102,

    here is the basic code for you to try...
    Code:
    
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title>background and centered content</title>
    
    <style type="text/css">
    body {
        background-color:#fff;
        background-image:url(http://www.auctionstealth.com/wp-content/themes/flexsqueeze/images/bg-fade.png);
        background-repeat:repeat-x;
     }
    #container {
        width:660px;
        padding:20px;
        border:1px solid #000;
        margin:auto;
        background-color:#fff;
     }
    </style>
    
    </head>
    <body>
    
    <div id="container">
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec 
    ultricies sollicitudin nisi, ut molestie felis adipiscing sit 
    amet. Sed auctor vehicula commodo. Nam a nibh neque, vitae 
    faucibus felis. Vivamus at metus eget eros consequat fringilla. 
    Quisque magna magna, laoreet eu tempus sit amet, fringilla at 
    tellus. Praesent felis tortor, scelerisque vitae fringilla 
    non, porttitor et lacus. Ut ut sapien nec quam tincidunt 
    consectetur in nec lacus.
    </p><p>
    Phasellus porta, dui a elementum egestas, odio sapien rhoncus 
    lorem, vitae bibendum erat sem eget sapien. Maecenas ut metus 
    ac quam pellentesque lacinia quis sit amet augue. Fusce eu 
    euismod urna. Nunc volutpat scelerisque tempus. Donec eget arcu 
    et mauris scelerisque tristique. Donec fringilla mauris dolor, 
    sit amet vulputate lacus. Nulla feugiat mattis nulla non 
    tincidunt. Nam sit amet dolor eros, a viverra lacus. Nunc quis 
    nisi eget neque tempus facilisis eu quis sapien.
    </p><p>
    Ut et metus a massa rhoncus cursus. Integer luctus luctus enim, 
    tristique rhoncus enim feugiat eu. Etiam porttitor volutpat 
    massa sed congue. Sed eros nisl, volutpat ac dapibus quis, 
    ultricies id diam. Mauris at elit eget quam ullamcorper sagittis 
    ac vel lorem. Ut nec justo libero. Phasellus eget pharetra elit. 
    Proin viverra, neque non eleifend vehicula, nulla augue gravida 
    felis, non fermentum lorem odio ac nunc. Aliquam pretium 
    scelerisque consectetur. Proin ultrices urna non magna interdum 
    a sodales turpis suscipit. Mauris sollicitudin nisl ac arcu 
    sodales cursus. Maecenas bibendum neque vitae orci mollis ac 
    vulputate ante auctor. Sed sodales odio id ante sagittis 
    faucibus.
    </p><p>
    Curabitur gravida, neque id volutpat tincidunt, justo eros 
    interdum dui, nec mattis eros nunc a ipsum. Aenean in orci id 
    turpis luctus interdum nec ut est. Nunc lacinia sagittis nibh 
    vitae bibendum. Cras malesuada, felis vitae egestas aliquet, 
    mauris diam vehicula quam, eget scelerisque felis nulla id 
    tellus. Curabitur non laoreet dolor. Vestibulum sodales 
    hendrerit elit vitae eleifend. Praesent faucibus mauris sed erat 
    accumsan ac cursus lacus molestie. Donec a nisi a risus malesuada 
    molestie nec at odio. Maecenas eleifend tincidunt lacus nec 
    vulputate. Vestibulum eleifend pulvinar sem, sit amet auctor eros 
    pellentesque quis. Sed et nulla non eros auctor malesuada. 
    Vestibulum erat arcu, hendrerit vel cursus nec, sagittis vitae 
    sapien. Nulla facilisi. Sed nec molestie mauris. Donec non dui 
    urna.
    </p><p>
    Aenean vel velit vel metus congue ultrices non ut lorem. Sed 
    viverra quam sit amet libero vestibulum eget porta sem mattis. 
    Pellentesque tincidunt convallis justo eu iaculis. Suspendisse 
    ut dui ante, et malesuada nisi. Praesent aliquet congue nulla 
    volutpat posuere. Curabitur orci magna, egestas nec mollis nec, 
    dapibus in erat. Vestibulum cursus est mauris, non gravida elit. 
    Curabitur at diam nisi.
    </p>
    </div>
    
    </body>
    </html>
    
    coothead


  •  

    Posting Permissions

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