Hi There.
I have a div which is 700 width and I want to have an image in the middle of the div. I understand that the best way to make it happen is to get the image to functions as a background image. How can I do it?
Thanks!Something like this:
<div style="background: url('imagefilename.ext') no-repeat 50%">Please try the following
<div style="width:700px;height:400px;border:1px solid blue;background: url(image.jpg) no-repeat 50% 50%"></div>?When using percentages or lengths, the horizontal position is specified first, followed by the vertical position. A value such as 20% 65% specifies that the point 20% across and 65% down the image be placed at the point 20% across and 65% down the element. A value such as 5px 10px specifies that the upper left corner of the image be placed 5 pixels to the right of and 10 pixels below the upper left corner of the element.
I have a div which is 700 width and I want to have an image in the middle of the div. I understand that the best way to make it happen is to get the image to functions as a background image. How can I do it?
Thanks!Something like this:
<div style="background: url('imagefilename.ext') no-repeat 50%">Please try the following
<div style="width:700px;height:400px;border:1px solid blue;background: url(image.jpg) no-repeat 50% 50%"></div>?When using percentages or lengths, the horizontal position is specified first, followed by the vertical position. A value such as 20% 65% specifies that the point 20% across and 65% down the image be placed at the point 20% across and 65% down the element. A value such as 5px 10px specifies that the upper left corner of the image be placed 5 pixels to the right of and 10 pixels below the upper left corner of the element.