Any help would be greatly appreciated!!
The page I’m working on is here
http://www.iknowpost.com/
What I’m attempting to do is keep the background image stretched to 100% height, regardless of the viewer’s screen size, while keeping the image centered horizontally on the page at all times. As of now I’ve got the 100% height figured out, but I’ve been trying unsuccessfully to figure out how to center it horizontally – currently it’s fixed left: 0px; I think this should be pretty simple. My code is below, and perhaps this isn’t the right way of going about this. Thanks!
<style type="text/css">
#background {
width: 100%;
height: 100%;
position: fixed;
left: 0px;
top: 0px;
z-index: -1;
}
.stretch {
height:100%;
}
</style>
</head>
<body>
<div id="background">
<img src="logo.jpg" class="stretch" alt="" />
</div>
</body>
</html>
Im sure there are other ways to add background like that, but in this case add
#background { text-align: center; }and it will center your image in the provided container.