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 3 of 3

Thread: body background

  1. #1
    New Coder
    Join Date
    Nov 2011
    Posts
    97
    Thanks
    2
    Thanked 0 Times in 0 Posts

    body background

    Hello, when I assign the background-image to body the image fill all the page but i would like to left two lateral white strips starting from the table border, do you know how can I do this?

    here two image and the html code, how it appears and how I would like it to appear... thank you





    Code:
    <body style="background-image: url(bkg.jpg)">
    <table
    style="text-align: left; width: 900px; height: 113px; margin-left: auto; margin-right: auto;"
    border="1" cellpadding="2" cellspacing="2">
    <tbody>
    <tr>
    <td style="vertical-align: top;"><br>
    </td>
    </tr>
    </tbody>
    </table>
    <br>
    <br>
    <h2 style="text-align: center;">TITOLO</h2>
    <br>
    </body>

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,678
    Thanks
    6
    Thanked 1,009 Times in 982 Posts
    Assign a width of 900px to the body (and margin: auto).

  • #3
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,302
    Thanks
    28
    Thanked 276 Times in 270 Posts
    Quote Originally Posted by paperino00 View Post
    do you know how can I do this?
    Code:
    <!doctype html>
    <html lang="en-US">
    	<head>
    		<title>Demo</title>
    		<style>
    			/* Defaults */
    			* { margin: 0; padding: 0; }
    			section { display: block; }
    			
    			/* Layout */
    			html { height: 100%; height: 100%; }
    			#layout { width: 900px; min-height: 100%; margin: 0 auto; }
    			#box { min-height: 113px; border: 3px ridge; }
    			section { margin-top: 2em; }
    			
    			/* Typography */
    			h1 { text-align: center; text-transform: uppercase; font-size: 1.5em; }
    		
    			/* Color Scheme */
    			html { background-color: white; color: black; }
    			#layout { background: lightgray url("bkg.jpg"); color: black; }
    			#box { border-color: silver; }
    		</style>
    		<!--[if lte IE 8]>
    			<script>
    				document.createElement("section"); /* WIE8 does not allow styling of the HTML5 section element without first creating it via JavaScript. */
    			</script>
    		<![endif]-->
    	</head>
    	<body>
    		<div id="layout">
    			<div id="box"></div>
    			<section>
    				<h1 lang="it">Titolo</h1>
    			</section>
    		</div>
    	</body>
    </html>
    For every complex problem, there is an answer that is clear, simple, and wrong.


  •  

    Posting Permissions

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