<html><head><style type="text/css"><!-- DIV {margin:0px;} --></style></head><body><div style="font-family:arial,helvetica,sans-serif;font-size:12pt"><div>Hi Wayne,<br><br>With out spending a bit of time on it, my approach would be <br><br>-wrap them in a div<br>-put them in a <ul></ul> no style for the list i.e. list-style:none; <br>-then float them to the left ie float:left;<br>- put some padding to the right so that there is space between them<br><br>maybe some further tweaking to make them look how you want, ie borders etc<br><br>Hope this helps<br><br>Mo<br><br></div><div style="font-family: arial,helvetica,sans-serif; font-size: 12pt;"><br><div style="font-family: times new roman,new york,times,serif; font-size: 12pt;"><font face="Tahoma" size="2"><hr size="1"><b><span style="font-weight: bold;">From:</span></b> Wayne Morris <waynelists@machx.co.uk><br><b><span style="font-weight: bold;">To:</span></b>
Wolverhampton Linux User Group <wolves@mailman.lug.org.uk><br><b><span style="font-weight: bold;">Sent:</span></b> Wed, 15 December, 2010 14:46:13<br><b><span style="font-weight: bold;">Subject:</span></b> [Wolves] CSS qustion - help - it should be easy!<br></font><br>
Help - it should be easy but I'm tearing my hair out trying to
figure css out - 7 hours of google last night and i still can't make
this stupid<br>
easy bit work.<br>
want page to look like:<br>
<br>
Image 1 Image 2 ---> Image 5 ---------------
preferably scale to fit webwindow but thats another thing<br>
Menu bar<br>
<br>
No matter what I do - use <p>, use image block instead of
inline, use all sorts of fancy snippets of code with div in them...<br>
the menu bar or any text I try instead just slaps itself on the top
line next to the images.<br>
I can fix it with lots of br's after the images so the text drops
down to the right place, but I understand that isnt a clever way.<br>
<br>
This is it working with br's:<br>
<a rel="nofollow" class="moz-txt-link-freetext" target="_blank" href="http://www.exceldiving.co.uk/test/zzz.html">http://www.exceldiving.co.uk/test/zzz.html</a><br>
<br>
please help!<br>
<br>
code below <br>
<br>
cheers<br>
<br>
Wayne<br>
<br>
<br>
<pre id="line1"><<span class="start-tag">html</span>><br><<span class="start-tag">head</span>><br><<span class="start-tag">link</span><span class="attribute-name"> rel</span>=<span class="attribute-value">"stylesheet" </span><span class="attribute-name">type</span>=<span class="attribute-value">"text/css" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">http://www.exceldiving.co.uk/test/tswtabs.css</a><span>" </span><span class="error"><span class="attribute-name">/</span></span>><br></<span class="end-tag">head</span>><br><br><br><br><<span class="start-tag">style</span><span class="attribute-name"> type</span>=<span class="attribute-value">"text/css"</span>><br>div.img<br>{<br> margin: 2px;<br> border: 0px solid #0000ff;<br> height: auto;<br> width: auto;<br> float: left;<br> text-align: center;<br>} <br>div.img img<br>{<br> display: block;<br> margin: 3px;<br> border: 1px solid
#ffffff;<br>}<br>div.img a:hover img {border: 1px solid #0000ff;}<br><br></<span class="end-tag">style</span>><br></<span class="end-tag">head</span>><br><<span class="start-tag">body</span>><br><br><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">klematis_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/PADILogo-L1.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Klematis" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span
class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br><br></<span class="end-tag">div</span>><br></pre>
<pre id="line34"><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">klematis2_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/lionfishsmall.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Klematis" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br> <br></<span
class="end-tag">div</span>><br><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">klematis3_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/companylogo.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Picture" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br> <br></<span
class="end-tag">div</span>><br><br><br><br><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">Picture3_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/pike.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Picture" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br></pre>
<pre id="line49"> <br></<span class="end-tag">div</span>><br><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">Picture4_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/PADILogo-L1.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Picture" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br>
<br></<span class="end-tag">div</span>><br><<span class="start-tag">div</span><span class="attribute-name"> class</span>=<span class="attribute-value">"img"</span>><br><br> <<span class="start-tag">a</span><span class="attribute-name"> target</span>=<span class="attribute-value">"_blank" </span><span class="attribute-name">href</span><span>="</span><a rel="nofollow">Picture4_big.htm</a><span>"</span>><<span class="start-tag">img</span><span class="attribute-name"> src</span><span>="</span><a rel="nofollow">/pics/PADILogo-L1.jpg</a><span>" </span><span class="attribute-name">alt</span>=<span class="attribute-value">"Picture" </span><span class="attribute-name">width</span>=<span class="attribute-value">"auto" </span><span class="attribute-name">height</span>=<span class="attribute-value">"90" </span><span class="error"><span class="attribute-name">/</span></span>></<span class="end-tag">a</span>><br> <br></<span
class="end-tag">div</span>><br><<span class="start-tag">p</span>><<span class="start-tag">p</span>><<span class="start-tag">br</span>></<span class="end-tag">br</span>><br><<span class="start-tag">br</span>></<span class="end-tag">br</span>><br><<span class="start-tag">br</span>></<span class="end-tag">br</span>><br></pre>
<pre id="line64"><<span class="start-tag">h1</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br>Why isn't this working!!!!<<span class="start-tag">br</span>><br></pre>
<br>
</div></div>
</div><br>
</body></html>