The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.
 
 
Thread Tools Display Modes
  #1  
Old 01-28-2013, 11:28 PM
Doug Rousse's Avatar
Doug Rousse is offline
Junior Member
 
Join Date: Jan 2013
Posts: 2
Default

Single Product Widget html: Options Table not centered with all other Info


When I drop the html into WordPress for a single product widget, the options table is aligned all the way to the left, while everything else is centered on the page. When I manually change the table code to "center" from "left" nothing happens. Please help!

Thank you

<div class='ecwid-Product'><form>
<div class='ecwid-productBrowser-head' style='text-align: center; padding-bottom: 15px; font: normal 20px tahoma, geneva, verdana, sans-serif'>Chocolate Dipped Gummi Worms</div>
<div class="ecwid-productBrowser-price" style='text-align: center; padding-bottom: 15px'>$5.50</div>
<table align='center' border='0'><tr><td align='left' class='ecwid'><div class="ecwid-productBrowser-details-optionPanel ecwid-productBrowser-details-optionPanel-radio ecwid-productoption-Gummy_Worm_Options-container" id="ecwid-productoption-18822278-Gummy_Worm_Options-container"><label for="gwt-uid-603" class="ecwid-fieldLabel">Gummy Worm Options</label><div id="gwt-uid-603"><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Milk_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-Milk_Chocolate"><input tabindex="0" id="gwt-uid-600" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-600"><span class="ecwid-productBrowser-details-optionRadioButton-name">Milk Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Dark_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-Dark_Chocolate"><input tabindex="0" id="gwt-uid-601" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-601"><span class="ecwid-productBrowser-details-optionRadioButton-name">Dark Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-White_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-White_Chocolate"><input checked="" tabindex="0" id="gwt-uid-602" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-602"><span class="ecwid-productBrowser-details-optionRadioButton-name">White Chocolate</span></label></span></div></div></td></tr></table><div style='text-align: center'><script type="text/javascript" src="http://app.ecwid.com/script.js?1735066" charset="utf-8"></script><script type="text/javascript">xAddToBag('productid=18822278');</script></div>
</form></div>
  #2  
Old 01-29-2013, 05:25 PM
Maya's Avatar
Maya Maya is offline
Ecwid Team
 
Join Date: Feb 2010
Location: Ecwid headquarter
Posts: 5,876
Default

In order to center product options list you should change "align" parameter's value from "left" to "center":
Code:
<div class='ecwid-Product'><form>
<div class='ecwid-productBrowser-head' style='text-align: center; padding-bottom: 15px; font: normal 20px tahoma, geneva, verdana, sans-serif'>Chocolate Dipped Gummi Worms</div>
<div class="ecwid-productBrowser-price" style='text-align: center; padding-bottom: 15px'>$5.50</div>
<table align='center' border='0'><tr><td align='left' class='ecwid'><div class="ecwid-productBrowser-details-optionPanel ecwid-productBrowser-details-optionPanel-radio ecwid-productoption-Gummy_Worm_Options-container" id="ecwid-productoption-18822278-Gummy_Worm_Options-container"><label for="gwt-uid-603" class="ecwid-fieldLabel">Gummy Worm Options</label><div id="gwt-uid-603"><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Milk_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-Milk_Chocolate"><input tabindex="0" id="gwt-uid-600" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-600"><span class="ecwid-productBrowser-details-optionRadioButton-name">Milk Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Dark_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-Dark_Chocolate"><input tabindex="0" id="gwt-uid-601" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-601"><span class="ecwid-productBrowser-details-optionRadioButton-name">Dark Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-White_Chocolate" class="gwt-RadioButton ecwid-productBrowser-details-optionRadioButton ecwid-productoption-Gummy_Worm_Options-White_Chocolate"><input checked="" tabindex="0" id="gwt-uid-602" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-602"><span class="ecwid-productBrowser-details-optionRadioButton-name">White Chocolate</span></label></span></div></div></td></tr></table><div style='text-align: center'><script type="text/javascript" src="http://app.ecwid.com/script.js?1735066" charset="utf-8"></script><script type="text/javascript">xAddToBag('productid=18822278');</script></div>
</form></div>
__________________
Maya N., Ecwid Team

------------------
Welcome to our new Help Center!
  #3  
Old 01-30-2013, 11:04 PM
Doug Rousse's Avatar
Doug Rousse Doug Rousse is offline
Junior Member
 
Join Date: Jan 2013
Posts: 2
Default single widget html options tables not aligned

Thank you for helping. Unfortunately,the code you provided still didn't do the trick. (I also had changed everything to center alignment) The options tables is still all the way to the left. Something is missing in this code. And I can't figure it out. Why is the html code coming straight out of Ecwid un-aligned??

Here is a link to how the code looks on my client's website. Thank you for your help!

http://laketahoechocolateshop.com.pr.../contact/test/


(code you provided)
<div class='ecwid-Product'><form>
<div class='ecwid-productBrowser-head' style='text-align: center; padding-bottom: 15px; font: normal 20px tahoma, geneva, verdana, sans-serif'>Chocolate Dipped Gummi Worms</div>
<div style='text-align: center; padding-bottom: 15px'>$5.50</div>
<table align='center' border='0'><tr><td align='left' class='ecwid'><div id="ecwid-productoption-18822278-Gummy_Worm_Options-container"><label for="gwt-uid-603">Gummy Worm Options</label><div id="gwt-uid-603"><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Milk_Chocolate"><input tabindex="0" id="gwt-uid-600" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-600"><span>Milk Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Dark_Chocolate"><input tabindex="0" id="gwt-uid-601" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-601"><span>Dark Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-White_Chocolate"><input checked="" tabindex="0" id="gwt-uid-602" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-602"><span>White Chocolate</span></label></span></div></div></td></tr></table><div style='text-align: center'><script type="text/javascript" src="http://app.ecwid.com/script.js?1735066" charset="utf-8"></script><script type="text/javascript">xAddToBag('productid=18822278');</script></div>
</form></div>
  #4  
Old 03-12-2013, 11:32 AM
Maya's Avatar
Maya Maya is offline
Ecwid Team
 
Join Date: Feb 2010
Location: Ecwid headquarter
Posts: 5,876
Default

I'm sorry for delay with answer. Please, add following styles that I have marked red in order to center product options list:
Code:
<div class='ecwid-Product'><form>
<div class='ecwid-productBrowser-head' style='text-align: center; padding-bottom: 15px; font: normal 20px tahoma, geneva, verdana, sans-serif'>Chocolate Dipped Gummi Worms</div>
<div style='text-align: center; padding-bottom: 15px'>$5.50</div>
<table align='center' border='0' style="margin: 0 auto 10px;"><tr><td align='left' class='ecwid'><div id="ecwid-productoption-18822278-Gummy_Worm_Options-container"><label for="gwt-uid-603">Gummy Worm Options</label><div id="gwt-uid-603"><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Milk_Chocolate"><input tabindex="0" id="gwt-uid-600" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-600"><span>Milk Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-Dark_Chocolate"><input tabindex="0" id="gwt-uid-601" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-601"><span>Dark Chocolate</span></label></span><span id="ecwid-productoption-18822278-Gummy_Worm_Options-White_Chocolate"><input checked="" tabindex="0" id="gwt-uid-602" value="on" name="18822278-Gummy Worm Options" type="radio"><label for="gwt-uid-602"><span>White Chocolate</span></label></span></div></div></td></tr></table><div style='text-align: center'><script type="text/javascript" src="http://app.ecwid.com/script.js?1735066" charset="utf-8"></script><script type="text/javascript">xAddToBag('productid=18822278');</script></div>
</form></div>
__________________
Maya N., Ecwid Team

------------------
Welcome to our new Help Center!
 
The information in this thread might be outdated
If the solution did not help, please, check our Help Portal or contact Ecwid Team.

Tags
html code, options table, single product widget

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 02:42 AM.
Powered by vBulletin® Version 3.8.11. Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.