You are using an out of date browser. It may not display this or other websites correctly.
You should upgrade or use an alternative browser.
You should upgrade or use an alternative browser.
i have a blog that i want to fix a little- but i know nothing abt html. can
- Thread starter Karla
- Start date
The grey space to the right of your header image is 50px wide. It is due to the image being 650px wide in a 700px wide space.
There are several things you could do. Simplest would be to centre the image in the space available, but that probably would not look very good. If you do want to do that, in your header image's img tag change:
style='display: block'
to be:
style='display: block; margin:0 auto;'
Next simplest would be to stretch the header image to fill the space available. Change:
width='650'
to be:
width='700'
Modern browsers are quite good at resizing images, so this should work OK.
If you do this you may want to preserve the aspect ratio of the image by increasing the height to:
height='377'
The last solution that I can think of is to get a new image, one that is 700px wide.
For more on the img tag that is used to display your header image, see http://www.html-tags-guide.com/html-img-tag.html
To help you locate where you would need to make these changes, here is a bit of the context around your header img tag:
<div id='header-inner'>
<a href='http://oneandonlynewnewyorker.blogspot.com/' style='display: block'>
<img alt='THE New New Yorker' height='350' id='Header1_headerimg' src='http://4.bp.blogspot.com/_FCl5hJQqmqY/S4SHF-BKwvI/AAAAAAAAAAw/LNzdLnlYlKo/S1600-R/PolaroidPictureBannercopy.jpg' style='display: block' width='650'/>
</a>
</div>
There are several things you could do. Simplest would be to centre the image in the space available, but that probably would not look very good. If you do want to do that, in your header image's img tag change:
style='display: block'
to be:
style='display: block; margin:0 auto;'
Next simplest would be to stretch the header image to fill the space available. Change:
width='650'
to be:
width='700'
Modern browsers are quite good at resizing images, so this should work OK.
If you do this you may want to preserve the aspect ratio of the image by increasing the height to:
height='377'
The last solution that I can think of is to get a new image, one that is 700px wide.
For more on the img tag that is used to display your header image, see http://www.html-tags-guide.com/html-img-tag.html
To help you locate where you would need to make these changes, here is a bit of the context around your header img tag:
<div id='header-inner'>
<a href='http://oneandonlynewnewyorker.blogspot.com/' style='display: block'>
<img alt='THE New New Yorker' height='350' id='Header1_headerimg' src='http://4.bp.blogspot.com/_FCl5hJQqmqY/S4SHF-BKwvI/AAAAAAAAAAw/LNzdLnlYlKo/S1600-R/PolaroidPictureBannercopy.jpg' style='display: block' width='650'/>
</a>
</div>
The grey space to the right of your header image is 50px wide. It is due to the image being 650px wide in a 700px wide space.
There are several things you could do. Simplest would be to centre the image in the space available, but that probably would not look very good. If you do want to do that, in your header image's img tag change:
style='display: block'
to be:
style='display: block; margin:0 auto;'
Next simplest would be to stretch the header image to fill the space available. Change:
width='650'
to be:
width='700'
Modern browsers are quite good at resizing images, so this should work OK.
If you do this you may want to preserve the aspect ratio of the image by increasing the height to:
height='377'
The last solution that I can think of is to get a new image, one that is 700px wide.
For more on the img tag that is used to display your header image, see http://www.html-tags-guide.com/html-img-tag.html
To help you locate where you would need to make these changes, here is a bit of the context around your header img tag:
<div id='header-inner'>
<a href='http://oneandonlynewnewyorker.blogspot.com/' style='display: block'>
<img alt='THE New New Yorker' height='350' id='Header1_headerimg' src='http://4.bp.blogspot.com/_FCl5hJQqmqY/S4SHF-BKwvI/AAAAAAAAAAw/LNzdLnlYlKo/S1600-R/PolaroidPictureBannercopy.jpg' style='display: block' width='650'/>
</a>
</div>
There are several things you could do. Simplest would be to centre the image in the space available, but that probably would not look very good. If you do want to do that, in your header image's img tag change:
style='display: block'
to be:
style='display: block; margin:0 auto;'
Next simplest would be to stretch the header image to fill the space available. Change:
width='650'
to be:
width='700'
Modern browsers are quite good at resizing images, so this should work OK.
If you do this you may want to preserve the aspect ratio of the image by increasing the height to:
height='377'
The last solution that I can think of is to get a new image, one that is 700px wide.
For more on the img tag that is used to display your header image, see http://www.html-tags-guide.com/html-img-tag.html
To help you locate where you would need to make these changes, here is a bit of the context around your header img tag:
<div id='header-inner'>
<a href='http://oneandonlynewnewyorker.blogspot.com/' style='display: block'>
<img alt='THE New New Yorker' height='350' id='Header1_headerimg' src='http://4.bp.blogspot.com/_FCl5hJQqmqY/S4SHF-BKwvI/AAAAAAAAAAw/LNzdLnlYlKo/S1600-R/PolaroidPictureBannercopy.jpg' style='display: block' width='650'/>
</a>
</div>