Alignment of Check Boxes in Word Press

Karen Knisely 2

Hello - We are having a problem with the alignment of the check boxes.  In OLX preview they are on the same line and just to the left.  Online in desk top view (word press) they come out above and to the right of the question. We have asked BB, but they said it was a problem with Word Press.  Does anyone have any tricks or java script edits that we can use?


Thanx - Karen

Mary Dunning 2

Hi Karen,

We are having same issue. Do you have a Wordpress site?  Did you ever resolve your issue?  If so, what did you do?


Thanks, Mary

Karen Knisely 2

Dear Mary - Thanx for asking!!, but no we have not found a solution yet.  We think the culprit might be the way our entire website if designed - something about it being too wide?  Our website guy is in the process of connecting with the web company we are working with.  I am at Moses Brown School here in Rhode Island if you want to see our main webpage.  Would you be willing to share with me your website?  Let's keep in touch in case either one of us is successful.  They could not afford to send me to BBCON - so if you are going maybe somebody there has ideas?  thanx - karen

Mary Dunning 2

Karen,

Did you create your form using Online Express?  here is link to our donation page that shows left alignment issues.  Our web developer said it isn't possible to fix. I don't believe him.
https://caridad.org/donate-now-online/


Mary

Phil Nawrocki

Hi Karen and Mary,


In your stylesheet. style.css, there is this selector:


input:not([type="button"]):not([type="checkbox"]):not([type="file"]):not([type="hidden"]):not([type="image"]):not([type="radio"]):not([type="reset"]):not([type="submit"]):not([type="color"]):not([type="range"]), textarea, select, option


with these declarations:


padding: 10px 20px;

max-width: 100%;

border-width: 1px;

border-style: solid;


You need to have your developer find a way to change the max-width to not apply to the OLX form. If he inspects the code and finds the above selector he can uncheck it. (developer talk) :-)


Then it will render as expected.


This seems to be a universal style sheet, so the developer will need to find a way to account for this.


Here is the style sheets location:
https://caridad.org/wp-content/themes/denta/theme-framework/theme-style/css/style.css?ver=1.0.0


Thanks,


Phil

 

Mary Dunning 2

Worked!  Thank you!  So appreciate community feedback.