How to alter poll answers in a row (vs a column)

[Mahoner]

Hi guys,

 

Rook here. I'm putting an embedded poll from an online site and this is the code I've got:

 

<p style="text-align: center;"><span style="color: #000000; background-color: #ffffff;"><span style="font-size: 18pt;">Select below your favorite Lego build!</span></span></p>

<p style="text-align: center;"><span style="color: #000000; background-color: #ffffff;"><span style="font-size: 18pt;"> </span></span></p>

<script type="text/javascript">// <![CDATA[

var cookie_booroo=0, surveyid=442930, random_booroo=0, enddate_booroo=1417237200000, maxchecked_booroo=2, jsonurl_booroo='//kwiksurveys.com/app/vote.asp', customurl_booroo='',jsonThemeString={"poll":{"bg_hide":1,"bg_opacity":0,"bg_color_start":"ffffff","bg_color_end":"ffffff","border_color":"ffffff","border_style":"solid","border_size_t":0,"border_size_r":0,"border_size_b":0,"border_size_l":0,"border_size_grouper":1,"border_radius_grouper":1,"border_radius_t":4,"border_radius_r":4,"border_radius_b":4,"border_radius_l":4,"border_size":0,"border_radius":0,"border_pref":0,"shadow_x":0,"shadow_y":0,"shadow_size":"0","shadow_blur":0,"shadow_color":"000000","shadow_style":"","padding_grouper":1,"padding_t":0,"padding_r":0,"padding_b":0,"padding_l":0,"margin_grouper":0,"margin_t":0,"margin_r":0,"margin_b":50,"margin_l":0},"pollpreview":{"bg_hide":1,"bg_opacity":0,"bg_color_start":"0a3f89","bg_color_end":"0e61aa","border_color":"000000","border_style":"solid","border_size_t":1,"border_size_r":0,"border_size_b":0,"border_size_l":0,"border_size_grouper":0,"border_radius_grouper":1,"border_radius_t":0,"border_radius_r":0,"border_radius_b":0,"border_radius_l":0,"border_size":1,"border_radius":0,"border_pref":1,"padding_grouper":1,"padding_t":10,"padding_r":10,"padding_b":10,"padding_l":10},"pquestion":{"bg_hide":0,"bg_opacity":0,"bg_color_start":"2d5e96","bg_color_end":"064cac","border_style":"solid","border_size_t":0,"border_size_r":0,"border_size_b":1,"border_size_l":0,"border_size_grouper":0,"border_radius_grouper":1,"border_radius_t":0,"border_radius_r":0,"border_radius_b":0,"border_radius_l":0,"border_size":0,"border_radius":0,"border_pref":1,"border_color":"3d6c98","font_family":"Arial,Helvetica,sans-serif","font_size":15,"font_color":"f0f0f0","font_bold":"bold","font_italic":"normal","text_shadow":0,"text_shadow_h":1,"text_shadow_v":1,"text_shadow_blur":0,"text_shadow_color":"7a7a7a","padding_grouper":0,"padding_t":20,"padding_r":15,"padding_b":20,"padding_l":15,"margin_grouper":1,"margin_t":0,"margin_r":0,"margin_b":0,"margin_l":0,"font_underline":"none"},"alabel":{"font_family":"Arial,Helvetica,sans-serif","font_size":12,"font_color":"0e0c0c","font_bold":"bold","font_italic":"normal","text_shadow":0,"text_shadow_h":0,"text_shadow_v":0,"text_shadow_blur":4,"text_shadow_color":"444444","padding_grouper":0,"padding_t":7,"padding_r":0,"padding_b":7,"padding_l":0,"margin_grouper":1,"margin_t":0,"margin_r":0,"margin_b":0,"margin_l":0,"font_underline":"none","answer_seperator":0},"bartext":{"font_family":"Arial,Helvetica,sans-serif","font_size":15,"font_color":"d4d4d4","font_bold":"bold","font_italic":"normal","text_shadow":0,"text_shadow_h":0,"text_shadow_v":0,"text_shadow_blur":2,"text_shadow_color":"444444","padding_grouper":0,"padding_t":0,"padding_r":0,"padding_b":0,"padding_l":0,"margin_grouper":0,"margin_t":0,"margin_r":0,"margin_b":0,"margin_l":0,"font_underline":"none"},"qviewa":{"font_family":"Arial,Helvetica,sans-serif","font_size":11,"font_color":"161313","font_bold":"bold","font_italic":"normal","font_color_hover":"444444","font_underline":"underline","text_shadow":0,"text_shadow_h":1,"text_shadow_v":1,"text_shadow_blur":1,"text_shadow_color":"444444","padding_grouper":1,"padding_t":0,"padding_r":0,"padding_b":0,"padding_l":0,"margin_grouper":1,"margin_t":0,"margin_r":0,"margin_b":0,"margin_l":0},"qbutton":{"font_family":"Verdana,Arial,Helvetica,sans-serif","font_size":12,"font_bold":"bold","font_italic":"normal","font_color":"ffffff","text_shadow":0,"text_shadow_h":1,"text_shadow_v":1,"text_shadow_blur":0,"text_shadow_color":"636263","bg_hide":0,"bg_opacity":0,"bg_color_start":"084288","bg_color_end":"084288","border_color":"00295c","border_style":"solid","border_size_t":1,"border_size_r":1,"border_size_b":1,"border_size_l":1,"border_size_grouper":0,"border_radius_grouper":0,"border_radius_t":0,"border_radius_r":0,"border_radius_b":0,"border_radius_l":0,"border_size":1,"border_radius":0,"border_pref":0,"padding_grouper":0,"padding_t":5,"padding_r":9,"padding_b":5,"padding_l":9,"margin_grouper":0,"margin_t":6,"margin_r":0,"margin_b":0,"margin_l":6,"font_underline":"none"},"bar":{"bg_hide":0,"bg_opacity":0,"bg_color_start":"ffffff","bg_color_end":"ffffff","border_color":"c2c2c2","border_style":"solid","border_size_t":1,"border_size_r":1,"border_size_b":1,"border_size_l":1,"border_size_grouper":0,"border_radius_grouper":0,"border_radius_t":0,"border_radius_r":0,"border_radius_b":0,"border_radius_l":0,"border_size":1,"border_radius":0,"border_pref":0,"padding_grouper":1,"padding_t":6,"padding_r":6,"padding_b":6,"padding_l":6,"margin_grouper":1,"margin_t":4,"margin_r":4,"margin_b":4,"margin_l":4},"barperc":{"font_family":"Arial,Helvetica,sans-serif","font_size":11,"font_color":"ffffff","text_shadow":0,"text_shadow_h":1,"text_shadow_v":1,"text_shadow_blur":3,"text_shadow_color":"ffffff","font_underline":"none"},"defaultpage":{"bg_color_start":"ffffff","bg_color_end":"ffffff","background_image_url":"","background_image_style":"Stretched","background_image_width":"1200","background_image_height":"904","poll_position":5,"bg_width":310},"default_options":{"help":0}};

// ]]></script>

<p><link href="//kwiksurveys.com/app_content/theme_poll/2/custom_themes/inc/cleanslate.css" rel="stylesheet" type="text/css" /></p>

<!--[if lt IE 7]><link rel="stylesheet" type="text/css" media="screen" href="//kwiksurveys.com/app_content/theme_poll/2/custom_themes/css/ie.css" /><![endif]-->

<div id="booroo_poll_container442930">

<div class="poll_booroo442930 "><!-- change poll width here -->

<div class="pquestion_booroo442930">Lego Build Challenge</div>

<div class="pollpreview_booroo442930 cleanslate">

<div class="content_booroo">

<div class="options_booroo"><form class="form_booroo"><fieldset>

<div class="padded_booroo"><input name="qid" value="442930" type="hidden" /><input name="sid" value="fanqam9hm81nsps442930" type="hidden" /><input name="pqid" value="38898" type="hidden" />

<div class="items_booroo">

<div class="row_booroo"><label for="ans-129642"><input type="radio" name="ans" value="129642" id="ans-129642" class="checkbox_booroo" />Lego Build Submission #1<br /><img src="http://kwiksurveys.com/UserFiles/404572/images/LB1.jpg" border="0" /></label></div>

<div class="row_booroo"><label for="ans-129643"><input type="radio" name="ans" value="129643" id="ans-129643" class="checkbox_booroo" />Lego Build Submission #2<br /><img src="http://kwiksurveys.com/UserFiles/404572/images/LB2.jpg" border="0" /></label></div>

</div>

<div id="submit_booroo" class="submit_booroo"><input class="qbutton_booroo442930" type="button" value="Vote Now" /></div>

<div class="booroo_footer"><a rel="nofollow" class="footer_hyperlink" href="https://kwiksurveys.com">

<p>Powered by kwiksurveys.com</p>

</a></div>

</div>

</fieldset></form></div>

<div class="results_booroo" style="display: none !important;">

<div class="padded_booroo"><label id="thank_you">

<div style="text-align: center;">Voting polls close on Saturday November 29th 2014 at 9AM EST. Thank you for your vote and good luck to all participants!<br /><br /><img alt="" src="http://kwiksurveys.com/UserFiles/404572/images/Lego%20Submit.jpg" style="width: 300px; height: 185px;" /><br /><br /> </div>

</label></div>

<div class="booroo_footer"><a rel="nofollow" class="footer_hyperlink" href="https://kwiksurveys.com/">

<p>Create a poll like this</p>

</a></div>

</div>

</div>

</div>

</div>

</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

<script src="//kwiksurveys.com/app/polltheme/2/poll-min.js?v=1.0.3" type="text/javascript"></script>

The problem I'm having is I want the images/answer selections to be placed side by side instead of one on top of the next. Currently I have it constructed with 2 answers but eventually it will be 12 answers I'd like to setup as 3 across by 4 down, if that makes sense.

Any help is much appreciated!

[niche]

Since you're a rook, please repost just the code that's relevant to your question including the css.

Edited November 3, 2014 by niche

[Ingolme]

There are two things you need to do before proceeding:

1. Properly indent your code
2. Make sure your HTML passes validation

Your large wall of text is impossible to debug. I need to see the HTML structure and Javascript code.