The standard install of the DNN Store Module (2.01.00) looks terrible on Firefox 3.0. I've been hacking away on the templates to try to get some improvement. I'm a CSS amateur so I'm not claiming this is a particularly great solution, but it does at least help the problems I was seeing. If anyone has any better ideas or links to better solutions I'd really appreciate it if you'd leave a comment saying so :)
Firstly DesktopModules\Store\Templates\ProductList.htm. Generally I prefer to use CSS for layout and positioning where possible, so I've simplified ProductList.htm significantly:
<div class="NewProduct-Entity">
<div class="NewProduct-Title">[MANUFACTURER]</div>
<div class="NewProduct-Title">[MODELNAME]</div>
<div class="NewProduct-Image" align="center">[IMAGE]</div>
<div class="NewProduct-Summary">[SUMMARY]</div>
<div class="NewProduct-Price">[VATPRICE][EDIT]</div>
<div class="NewProduct-AddToCart">[ADDTOCARTIMG]</div>
<div class="NewProduct-LinkDetail">[LINKDETAIL][LINKDETAILIMG]</div>
</div>
Depending on whether you show prices inclusive or exclusive of sales tax (VAT), you might want to change [VATPRICE] to just [PRICE].
Next the CSS to make that htm look ok is in DesktopModules\Store\Templates\StyleSheet\StoreFront.css. This was where I spent ages to get this work. The changes were in the first section which now looks like the following (for my setup at least). NOTE THIS IS JUST THE CHANGES TO THE START OF THE FILE - DO NOT REPLACE YOU'RE WHOLE FILE WITH THIS!!!
DIV.NewProduct-Entity { margin:15px; display:inline; }
.NewProduct-Entity { position:relative; width:270px; max-width:300px; text-align:center; padding:5px 5px 0 5px; }
.NewProduct-Entity SPAN, .NewProduct-Entity P, .NewProduct-Entity TABLE, .NewProduct-Entity TD, { padding:1px 1px 0 1px; }
.NewProduct-Entity A.normalbold:link,
.NewProduct-Entity A.normalbold:visited { }
.NewProduct-Entity A.normalbold:hover { }
.NewProduct-Image { width:90px; height:90px; display:block; vertical-align:middle; horizontal-align:middle; text-align:center; margin:2px 2px 2px 2px; padding:0px 0px 0px 0px; float: center}
.NewProduct-Image IMG { border:0; text-align:middle; float: center}
.NewProduct-Price SPAN { height : 45px; display:block; padding-top:5px; }
.NewProduct-AddToCart { height : 45px; display:block; padding-bottom:5px; text-align:center; }
.NewProduct-AddToCart A:link,
.NewProduct-AddToCart A:visited,
.NewProduct-AddToCart A:active { }
.NewProduct-LinkDetail { height : 15px; display:block; text-align:right; }
.NewProduct-Title SPAN { display:block; text-align:center; padding:2px; }
.NewProduct-Title A.normalbold:link,
.NewProduct-Title A.normalbold:visited { }
.NewProduct-Title A.normalbold:hover { }
.NewProduct-Summary { text-align:left; margin:2px; padding:0px; width:250px; white-space:normal;}
.NewProduct-Summary SPAN { white-space:normal; display:block;}
The .NewProduct-Entity width is the overriding width of the entry, but .NewProduct-Summary width seems to be the bit that stops the summary text from flowing all over the shop which was the biggest formatting issue I was getting.
It's quite possible that some of this is unnecessary, but by the time I managed to get it working I was so fed up tweaking it that I was happy to leave it for a while. I'll probably come back to it in a few weeks and 'prune' it clean.
Anyway