<style>
h1 { padding: .2em; margin: 0; }
#products { float:left; width: 500px; margin-right: 2em; }
- #cart { width: 200px; float: left; }
+ #cart { width: 200px; float: left; margin-top: 1em; }
/* style the list to maximize the droppable hitarea */
#cart ol { margin: 0; padding: 1em 0 1em 3em; }
</style>
<body>
<div class="demo">
-
+
<div id="products">
- <h1 class="ui-widget-header">Products</h1>
+ <h1 class="ui-widget-header">Products</h1>
<div id="catalog">
- <h3><a href="#">T-Shirts</a></h3>
+ <h2><a href="#">T-Shirts</a></h2>
<div>
<ul>
<li>Lolcat Shirt</li>
<li>Buckit Shirt</li>
</ul>
</div>
- <h3><a href="#">Bags</a></h3>
+ <h2><a href="#">Bags</a></h2>
<div>
<ul>
<li>Zebra Striped</li>
<li>Alligator Leather</li>
</ul>
</div>
- <h3><a href="#">Gadgets</a></h3>
+ <h2><a href="#">Gadgets</a></h2>
<div>
<ul>
<li>iPhone</li>