Graeme Posted April 27, 2010 Report Share Posted April 27, 2010 Hello All, On a home page I have a Div with in a Div to create a watermark behind some text. I use:- <div id="content"> <div class="blockCenter"> <!-- Watermark on 1st Page --> I tried to code a background image in "blockCenter" but it doesn't show up. My CSS is:- div.blockCenter { width: 70%; top: 500px; border: 0px dotted #CCC; margin-left: auto; margin-right: auto; clear: both; background: url("../images/") no-repeat 100% 100% #A4D5FE; } I would like the image to appear as a watermark behind the text beginning with 'Our mission is to . .' Any ideas will be greatly appreciated. My temp URL is http://www.btinternet.com/~gj.d/bits/index.html Thank you as always. Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 27, 2010 Report Share Posted April 27, 2010 (edited) Your online page has the styles:- div.block, div.blockDistinct, div.blockCenter { padding: 10px; padding-bottom: 3px; padding-top: 8px; } div.blockDistinct { background: url("../images/") no-repeat 100% 100% #A4D5FE; } div.blockCenter { width: 70%; top: 500px; border: 0px dotted #CCC; margin-left: auto; margin-right: auto; clear: both; } relating to div.blockCenter and there is no background-image coded. It should show if you add the code correctly:- div.block, div.blockDistinct, div.blockCenter { padding: 10px; padding-bottom: 3px; padding-top: 8px; } div.blockDistinct { background: url("../images/") no-repeat 100% 100% #A4D5FE; } div.blockCenter { width: 70%; top: 500px; border: 0px dotted #CCC; margin-left: auto; margin-right: auto; clear: both; background: #A4D5FE url(../images/image.jpg) no-repeat 0 0; } You coded the url without an image filename in your post; you don't need to put it inside "..." and 100% 100% for the position will put it at the very bottom right corner of the div, if that's what you want. 0 0 or 0% 0% or top left will position it at the top left of the div. ../images is the path to go up one directory/folder and then down into the images folder/directory. The #A4D5FE background color should be coded before the background image, although that doesn't usually make any difference. Edited April 27, 2010 by Wickham Quote Link to comment Share on other sites More sharing options...
Graeme Posted April 28, 2010 Author Report Share Posted April 28, 2010 Hello, Thanks and tahnks again, it is just what I want. Can I ask you what are different position numbers? Thank you, Best wishes Graeme Quote Link to comment Share on other sites More sharing options...
Wickham Posted April 28, 2010 Report Share Posted April 28, 2010 This should help you:- http://www.w3schools.com/css/pr_background-position.asp Quote Link to comment Share on other sites More sharing options...
marry_outsource project Posted May 21, 2010 Report Share Posted May 21, 2010 This should help you:- http://www.w3schools.com/css/pr_background-position.asp I was saying the same Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.