How do I get an image to go across the top of a webpage?
|
11-09-2012, 08:51 PM
Post: #1
|
|||
|
|||
How do I get an image to go across the top of a webpage?
I'm currently re-working a webpage (using just CSS and HTML.) There's an image that is supposed to go across the top of the page. The problem is, the image has a specified size, so I can get it to fit when I'm viewing it on, say, my monitor, but on a different monitor or different browser it stops short and there's just this blank space to the right of the image. How can I tell it to size itself to fit the length of the page?
Ads |
|||
11-09-2012, 08:59 PM
Post: #2
|
|||
|
|||
You can try to change the specified size on the css!
for example; #image { background-image: url(../images/images.jpg); background-repeat: no-repeat; position: relative; width: 50px; height: 50px; left: 688px; top: 83px; margin-right: auto; margin-left: auto; } //change the width, height, left (might be right), and top to your needs// For ie6, ie7, and ie8, you need to add the codes below, and change them according to your needs! <!--[if lte IE 6]> <style type="text/css"> .clearfix {height: 1%;} img, div, input, h3 { image-position: -1000px; //(don't change this)// behavior: url(../scripts/iepngfix.htc"); //(create a iepngfix.htc to view png files, otherwise pngs and gifs (especially transparent ones) wouldn't work on ie6).// } h1.image a, #image{ background-position: -1000px; } h1.image a { cursor: pointer; } </style> <![endif]--> <!--[if (IE 7.0)]> <style type="text/css"> #image {XXpx} //check the image on your browser, and specify the XX part - this will move the image let's say 2px to the right on ie7 make the picture where you want it to be// .clearfix {display: inline-block;} </style> <![endif]--> <!--[if (IE 8.0)]> <style type="text/css"> #image {XXpx} //again check the image on your browser, and specify the XX part// .clearfix {display: inline-block;} </style> <![endif]--> ie6 might be confusing, so i recommend you not to use ie6 codes...facebook, youtube, and many others don't work with ie6 anymore. So just use the codes for ie7 and ie8 above. //hope this helps// Ads |
|||
« Next Oldest | Next Newest »
|
User(s) browsing this thread: 1 Guest(s)