Fri, 2014-02-07 16:00
Hi there,
I have created a table via CSS that I like but I can't get them to sit next to each other rather than underneath each other.
I did it at some point in the past but can't for the life of me work out how I did it. Lost the custom code in a site backup restore.
My brain maybe being slightly frazzled from redoing everythign but any help would be greatly appreciated.
Here is the page
http://enjoythewater.ky/services-rates/
Here is the page code:
<div id="pricelist"> <h2>1 Day of Diving</h2> <ul id="prices"> <li><a href="#">2 Tank Dive $105</a></li> <li><a href="#">1 Tank Dive $75</a></li> <li><a href="#">3 Tank Adv. $155</a></li> <li><a href="#">Stingray City $55</a></li> <li><a href="#">Sandbar $45</a></li> </ul> </div> <div id="pricelist"> <h2>3 Days of Diving</h2> <ul id="prices"> <li><a href="#">2 Tank Dive $95</a></li> <li><a href="#">1 Tank Dive $70</a></li> <li><a href="#">3 Tank Adv. $150</a></li> <li><a href="#">Stingray City $45</a></li> <li><a href="#">Sandbar $40</a></li> </ul> </div> <div id="pricelist"> <h2>6 Days of Diving</h2> <ul id="prices"> <li><a href="#">2 Tank Dive $85</a></li> <li><a href="#">1 Tank Dive $65</a></li> <li><a href="#">3 Tank Adv. $145</a></li> <li><a href="#">Stingray City $40</a></li> <li><a href="#">Sandbar $35</a></li> </ul> </div>
And here is the CSS I am using at the minute
.pricelist { width: 200px; float: left; } #prices ul { list-style-type: none; margin: 0; padding: 0; width: 150px; float: left; } #prices li { border-bottom: 1px solid #ccc; width: 150px; } #prices li:last-child { border: none; } #prices li a { text-decoration: none; color: #000; display: block; width: 150px; } #prices li a:hover { background: #f6f6f6; }
Any and all help greatly appreciated.
Fri, 2014-02-07 17:36
#1
Never mind anyone I realised
Never mind anyone I realised my mistake. I can't see how to delete thread so I will leave you with this . solved .. I am an idiot.
Giles