I am having styling issue with products loaded in datalist control in Chrome. While everything looks ok in FF, Chrome gives me weird styling. Here are the screenshots: FF: http://gyazo.com/214fcfafbfb91e17ea1f084af84e61e4.png?1341955023 Chrome: http://gyazo.com/4459dc38dc01a18f62780392d8fb3625.png?1341955739 Here is the html markup: <div class="product-grid"> <asp:DataList ID="dlCatalog" runat="server" RepeatColumns="2" RepeatDirection="Horizontal" RepeatLayout="Table" ItemStyle-CssClass="item-box"> <ItemTemplate> <nopCommerce:ProductBox1 ID="ctrlProductBox" Product='<%# Container.DataItem %>' runat="server" /> </ItemTemplate> </asp:DataList> </div> Here is the CSS: .product-grid { margin-bottom: 15px; width: 586px; text-align: center; margin-left: -10px; } .product-grid .item-box { text-align: center; vertical-align: top; padding: 10px 11px 60px 11px; } .product-grid .product-item { text-align: center; margin: 10px 5px 10px 5px; width: 250px; background: url('images/prod_grid_box_bg.gif') no-repeat 0 100%; } .product-grid .product-item .product-title { font-weight: bold; font-size: 12px; background: url('images/deal_box_hl.gif') no-repeat 0 0; padding-left: 10px; } .product-grid .product-item .product-title a { background: url('images/deal_box_hr.gif') no-repeat 100% 0; display: block; height: 2em; line-height: 1.3em; overflow: hidden hidden; padding: 4px 10px 8px 0px; } .product-grid .product-item .picture { text-align: center; margin-top: 10px; } .product-grid .product-item .description { margin: 5px 5px 0 5px; text-align: center; padding: 10px 5px 10px 5px; border-top: solid 1px #e3e3e3; color: #555; height: 50px; } .product-grid .product-item .add-info { vertical-align: bottom; text-align: right; width: 250px; height: 85px; position: relative; } .product-grid .product-item .add-info .prices { text-align: right; vertical-align: middle; position: absolute; bottom: 15px; right: 10px; } .product-grid .product-item .add-info .buttons { vertical-align: middle; position: absolute; bottom: 15px; left: 10px; text-align: left; } .product-grid .product-item .add-info .prices .productPrice { color: green; } .product-grid .product-item .add-info .prices .oldproductPrice { color: Red; text-decoration: line-through; } Every help is welcome. Thanks in advance, Laziale UPDATE: No one can help me?
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)