This Forum Has Been Archived
*Click Here To Visit The NEW Forum*



Image 100% of width

Designing your own website? Need help? Ask your questions and share your favorite resources here... Tables, Forms, Color Scheme & Layout, Scripts, Programs & Resources

Moderators: angienewton, tknoppe, terrapin719, lisamariemary

Image 100% of width

Postby susapra » Fri Sep 26, 2008 11:30 am

How do I get an image to be 100% of the screen width, without creating a sideways scroll bar in lower screen resolution displays?

Madrid Hotels high quality tea
Posts: 22
Joined: Tue Sep 16, 2008 9:03 am

Postby alexc » Sat Sep 27, 2008 7:59 pm

Well the problem you are facing is that different people will have different resolutions so you will never be able to get that to happen without stretching or distorting the image. Trust me when I say that you do not want to allow the browser to resize an image. I'm sorry but there is no easy way to solve this problem.
Posts: 209
Joined: Tue Jul 22, 2008 5:51 pm


Postby prajani » Mon Mar 09, 2009 5:54 am

<img src ="/image.jpg" WIDTH=800>

will stretch the image

WIDTH="100%" will fill the page with the image but if it is a different resolution you could end up with the image repeating itself.
Posts: 3
Joined: Mon Mar 09, 2009 5:19 am

Postby tknoppe » Mon Mar 09, 2009 9:27 am

AS the others have posted, your site visitors will all have different browser resolutions, so no way to dictate that.

Where is this image going to be placed within the site? insert into a page, in a pop-up window, or as a background image?

If it's a background image, you could create the image at whatever size you want, or it needs to be; then add this code to your stylesheet to center it, without repeating:

Code: Select all
background-color: #FFFFFF;
   background-image: url(images/image.jpg);
   background-repeat: no-repeat;
   background-position: center center;

Obviously change the above parameters to reflects your needs and apply it to whatever tag or class you need (i.e. body)
User avatar
Elite Member
Posts: 1026
Joined: Sun Sep 14, 2008 11:36 am
Location: Missouri, USA

Return to HTML, Web Design & Programming

Who is online

Users browsing this forum: No registered users and 1 guest