Superior Web Solutions 905 532 9642Free Project Estimator
HOME CLIENTS SERVICES BLOG ABOUT US CONTACT US
Categories:
 Internet Marketing
 iPhone iPad Apps Development
 IT Humour
 IT Industry News
 Search Engines
 User Guides
 Web Development
Browse by tags
Search Blog:
RSS
Subscribe to our newsletter
Name*:
E-Mail*:
Recent Posts
Secure Web Development: SSL Certificate Is Installed, but Browser Displays Warning
PHP, allow visitor to download image that is not on your server
New Home For Web Development
Mobile Websites Development versus Mobile Apps development
Most Common Screen Resolutions in 2011
Make PHP CAPTCHA more secure
December 07, 2010 - Using background-repeat and background-position together

Problem: having a background of container that has to be repeated vertically (background-repeat:y-repeat;) start not from the top, and along with that to have a background in inner container that will start from the top of main container

Solution: Add margin to main container, and then add margin to inner container with the negative value of main containers margin. Here is a CSS for that:

topContainer
{
   background-image:url(img/mainBG.png);
   background-repeat:y-repeat;
   margin-top:29px;
}
innerContainer
{
   background-image:url(img/mainBGtop.png);
   background-repeat:no-repeat;
   background-position:top;
   margin-top:-29px;
}
 

Associated tags:  HTML, CSS, Background, Background-image, Container, Margin, Margin-top, Background-repeat, Y-repeat
Comments:
Christian wrote on August 28, 2011 at 12:07
Was looking for a solution for ages. Thanks!
Add Comment:
Name*:
E-Mail: Website:
Your message*:
»
© 2000 - 2012 Superior Web Solutions