I am new to coding, but love it. All from scratch and tutorials.<br />
I have several small images (60x60ish) which I would like to spread out from top to bottom by percentage of the browser it's viewed in. Not resize, but space in between the images would change according to browser. This is what I have so far <!-- m --><a class="postlink" href="http://www.kingwhistle.com">http://www.kingwhistle.com</a><!-- m --><br />
Any help is greatly appreciated.<br />
Thanks, Thad.<br />
PS- Are quotation marks required around values? i.e.- width="100"<!--content-->Hi Thad,<br />
<br />
Welcome to HTML Forums and to coding
<br />
<br />
Technically you do not need to use the quotations unless there are spaces in the attribute, like alt="this has spaces" or unless you run your code together like you have done border="2"alt="Hard Rock MP3" there really should be a space after "2" and before alt but as long as you have the quotes the code will still work.<br />
<br />
To get the space between the images to expand or contract accordingly you can place each image in a table cell like so (note the additional code such as rowspan and valign:<br />
<br />
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"LBM_58x55.jpg" width="58" height="55" align="center" border="2"alt="Hard Rock MP3"> <br />
</td><br />
<td align="center" rowspan=8> <br />
<img src=http://www.htmlforums.com/archive/index.php/"KW_text_450x40.jpg" width="450" height="40" align="center" border="2"alt="King Whistle Studio"> <br />
<BR> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Studer*.jpg" width="350" height="338" align="center" border="2"alt="tape player"> <br />
<BR> <br />
<img src=http://www.htmlforums.com/archive/index.php/"bot_text_435x59.jpg" width="435" height="59" align="center" border="2"alt="music production and composition"> <br />
<BR> <br />
</tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Whischi_44x60.jpg" width="44" height="60" align="center" border="2"alt="Nerd Rock MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Whis_68x60.jpg" width="68" height="60" align="center" border="2"alt="Jazzy MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Trace_57x60.jpg" width="57" height="60" align="center" border="2"alt="Singer-Songwriter MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"monk_39x60.jpg" width="39" height="60" align="center" border="2"alt="New Ambient MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"toy_76x20.jpg" width="76" height="20" align="center" border="2"alt="car show MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Radio_55x55.jpg" width="55" height="55" align="center" border="2"alt="jingle MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"jubei_81x40.jpg" width="81" height="40" align="center" border="2"alt="Animation MP3"> <br />
</td> <br />
<br />
</td> <br />
</tr> <br />
</table> <br />
<br />
<br />
Regards,<br />
Kevin<!--content-->Awesome reply Kevin!<br />
<br />
I see now that it is simple tables, but I was having trouble with the rowspan before you showed me how!<br />
Thanks again.<br />
Maybe now I'll be able to help someone else out with that one!<br />
<br />
Thaddeus.<!--content-->Just one point on the quotes. To be compliant with the XHTML 1.0 standard all values have to be quoted.<!--content-->
I have several small images (60x60ish) which I would like to spread out from top to bottom by percentage of the browser it's viewed in. Not resize, but space in between the images would change according to browser. This is what I have so far <!-- m --><a class="postlink" href="http://www.kingwhistle.com">http://www.kingwhistle.com</a><!-- m --><br />
Any help is greatly appreciated.<br />
Thanks, Thad.<br />
PS- Are quotation marks required around values? i.e.- width="100"<!--content-->Hi Thad,<br />
<br />
Welcome to HTML Forums and to coding
<br /><br />
Technically you do not need to use the quotations unless there are spaces in the attribute, like alt="this has spaces" or unless you run your code together like you have done border="2"alt="Hard Rock MP3" there really should be a space after "2" and before alt but as long as you have the quotes the code will still work.<br />
<br />
To get the space between the images to expand or contract accordingly you can place each image in a table cell like so (note the additional code such as rowspan and valign:<br />
<br />
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0"> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"LBM_58x55.jpg" width="58" height="55" align="center" border="2"alt="Hard Rock MP3"> <br />
</td><br />
<td align="center" rowspan=8> <br />
<img src=http://www.htmlforums.com/archive/index.php/"KW_text_450x40.jpg" width="450" height="40" align="center" border="2"alt="King Whistle Studio"> <br />
<BR> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Studer*.jpg" width="350" height="338" align="center" border="2"alt="tape player"> <br />
<BR> <br />
<img src=http://www.htmlforums.com/archive/index.php/"bot_text_435x59.jpg" width="435" height="59" align="center" border="2"alt="music production and composition"> <br />
<BR> <br />
</tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Whischi_44x60.jpg" width="44" height="60" align="center" border="2"alt="Nerd Rock MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Whis_68x60.jpg" width="68" height="60" align="center" border="2"alt="Jazzy MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Trace_57x60.jpg" width="57" height="60" align="center" border="2"alt="Singer-Songwriter MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"monk_39x60.jpg" width="39" height="60" align="center" border="2"alt="New Ambient MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"toy_76x20.jpg" width="76" height="20" align="center" border="2"alt="car show MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"Radio_55x55.jpg" width="55" height="55" align="center" border="2"alt="jingle MP3"> <br />
</td></tr> <br />
<tr> <br />
<td align="center" valign="middle"> <br />
<img src=http://www.htmlforums.com/archive/index.php/"jubei_81x40.jpg" width="81" height="40" align="center" border="2"alt="Animation MP3"> <br />
</td> <br />
<br />
</td> <br />
</tr> <br />
</table> <br />
<br />
<br />
Regards,<br />
Kevin<!--content-->Awesome reply Kevin!<br />
<br />
I see now that it is simple tables, but I was having trouble with the rowspan before you showed me how!<br />
Thanks again.<br />
Maybe now I'll be able to help someone else out with that one!<br />
<br />
Thaddeus.<!--content-->Just one point on the quotes. To be compliant with the XHTML 1.0 standard all values have to be quoted.<!--content-->