Menu
I'm a CSS fresher. What I'm trying to do is I want to lay a background image in an HTML. My intent is I want to left margin the background image of 200px. My code is shared as below or you can check in this jsfiddle: http://jsfiddle.net/benmore/D5sNs/
<style type="text/css">
body{
margin-left:200px;
background:#5d9ab2 url(https://lh5.googleusercontent.com/-ZBLYo1oD6bM/UHox3oBICxI/AAAAAAAAAgo/yCg6TcxLeC4/s358/img_tree.png) no-repeat top left;
}
.container {
text-align:center;
width: 100px;
}
</style>
<title></title>
</head>
<body class="homepage">
<div class="container">
test
</div>
</body>
My only problem is the background is staying closed to the left. What can I do to make it starts 200px from the left edge of the page?
841
Add background-position: 200px 0; to your body's CSS
Demo: http://jsfiddle.net/D5sNs/1/
The background-position CSS property allows you to position your background image around the container. Read more here: http://reference.sitepoint.com/css/background-position
102
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
