Text trouble

While not quite finished with this page, I had a friend look at it and he said that the text is running into the image at the right in the center table.<br />
<br />
<!-- m --><a class="postlink" href="http://www.pro-hillclimbers.org/jason.html">http://www.pro-hillclimbers.org/jason.html</a><!-- m --><br />
<br />
How is the vspace and hspace coded into the image tag?<br />
Does it matter where it is inserted?<br />
<br />
<IMG BORDER="0" SRC=http://www.htmlforums.com/archive/index.php/"jason2.jpg" ALIGN="RIGHT" WIDTH=431 HEIGHT=562 ALT=JASON SMITH"><br />
<br />
Tried a search but did not find anything, :( <br />
Thanks<!--content-->The problem isn't the hspace and vspace . . .it's that when you bring the resolution down on the screen the text gets crushed under the image. One way to prevent that is to determine how small you are willing to allow your page to be before you would rather see a scroll bar at the bottom than watch your layout get all broken.<br />
<br />
I usually make sure my pages can shrink to 600 px wide without compromising my layout.<br />
<br />
I see that you are using percentages for your tables to make them fill the screen -- and that looks nice. Within your center td(where you have your photo and main content), though, you might want to put a clear gif up at the top set at a width of 500. This will ensure that that TD will not get any smaller than 500 pixels wide.<br />
<br />
Your image is 431 px, so that should leave room for your text.<br />
<br />
Just from a design standpoint . . .you might want to use another color for your main text. Red is traditionally for alerts and other information that needs to be eyecatching, and a lot of it is hard on the eyes to read.<br />
<br />
I would 1) choose a deeper red -- perhaps #990000 or <br />
2) go with a different color -- blue maybe?<br />
or 3) and this is my personal design choice -- only use colored text for page and section headers, otherwise use regular easy-to-read black and call out items of importance with bold or italics.<br />
<br />
-beth<!--content-->vspace and hspace act just like the border property (except in the case of links in that the margins don't have color).<br />
It's generally best to use border instead.<br />
<br />
Your page looks OK when viewed full-screen, however if I shrink the window then the text does run into the picture a bit.<br />
This is to be expected as you have absolute pixel measures in your height and width attributes. eg. height=23 width=78.<br />
If you don't want this to happen then use percentages instead. eg. height=10% width=27%.<br />
<br />
Other than that, the page looks really good.<!--content-->Did not care for it the first time I saw it. Just haven't decided what color to use. I will try that darker red or figure out how to use a font weight code. <br />
<br />
The reason I wanted to hopefully solve the problem with a vspace code was the stars along the left margin are all pages which I need to build also, and the pictures of these different riders are of all assorted sizes so it would be best if I could stop the text from getting crunched by the different size pictures.<br />
<br />
The vspace is kind of impenetrable border right<!--content-->
By etridco:<br />
you might want to put a clear gif up at the top set at a width of 500. This will ensure that that TD will not get any smaller than 500 pixels wide. <br />
<br />
Do you mean a spacer gif 500 pixels wide?<br />
<br />
<br />
By jonhanlon:<br />
If you don't want this to happen then use percentages instead. eg. height=10% width=27%. <br />
<br />
Do you mean image size set as % ?<!--content-->Do you mean a spacer gif 500 pixels wide? <br />
<br />
<br />
Yes he does. An example would be...<br />
<br />
<br />
<!-- sets table width to fill screen --><br />
<table width="100%"> <tr><br />
<!-- set minimum width to be 500 pixels --><br />
<td colspan="2"><img src=http://www.htmlforums.com/archive/index.php/"spacer.gif" width="500"></td><br />
</tr><br />
<tr><br />
<!-- Your content --><br />
<td><img src=http://www.htmlforums.com/archive/index.php/"YourImage.jpg"></td><br />
<td>Some text</td><br />
</tr><br />
</table><!--content-->Thanks Torrent, I didn't have time to write out the code yesterday . . .but that's exactly what I meant.<br />
<br />
-beth<!--content-->Have a lot of work still to do on it.<br />
<br />
I appreciate all the help.:) :D<!--content-->
 
Back
Top