[Jaxel]

Okay... I'm just going to accept that you can't do percentages properly with the box model... an inherint flaw of design... and move on from it... however, now I have a new issue...

Using the following code: (I added padding and borders so its easier to see...)

	<li style="-webkit-box-shadow: #C8C8C8 -2px 2px 2px; background: white none; border: 1px solid #E9E9E9; display: block; float: left; padding: 10px; margin: 20px 0px 0px 20px; width: 500px; text-align: center;">
		<div>
			<div style="padding: 10px; border: 1px solid #000000; float: left;">
				<a href="media.php?{vb:raw session.sessionurl}mediaid={vb:raw mediaID}"><img src="{vb:raw thumbnail}" border="0" alt="{vb:raw title}" width="150" /></a>
			</div>
			<div style="padding: 10px; border: 1px solid #000000;">
				<a href="media.php?{vb:raw session.sessionurl}mediaid={vb:raw mediaID}">{vb:raw title}</a><br />
				{vb:raw date} at <span class="time">{vb:raw time}</span> by {vb:raw username}<br /><br />
				<img src="{vb:stylevar imgdir_rating}/rating-trans-15_{vb:raw rating}.png" alt="Rating: {vb:raw rating}" />
			</div>
		</div>
		<div style="padding: 10px; border: 1px solid #000000;">
			{vb:var preview}
		</div>
		<div style="padding: 10px; border: 1px solid #000000;">
			Tags:
		</div>
	</li>

I get the following:


How would I change the code so I get the following instead?