/*Grid system*/ #PictureBox { float:left; width: 220px; padding-bottom: 30%; /* = width for a 1:1 aspect ratio */ overflow:hidden; margin:1.66%; border: 1px solid #000; } #TextBox { float:left; position: relative; width: 100px; padding-bottom: 30%; /* = width for a 1:1 aspect ratio */ overflow:hidden; margin:1.66%; border: 1px solid #000; } /*End of Grid System*/
<div id="content"> <div id="PictureBox"> [*legoImages*] </div> <div id="TextBox"> [*legoItemText*] </div> [*content*] </div>
This question has been answered by iusemodx. See the first response.
<div id="PictureBox">[*legoImages*]</div>
<div id="PictureBox"><img src="[*legoImages*]" alt=""></div>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8">
</br>
<br /> or for HTML5 <br>