-
RobertAsked on February 24, 2017 at 8:31 PM
HOw do i stop my product from looking like this when I preview the form.
On the design screen its perfect.
My CSS - I change my page width to be a 1000
.form-product-item {
border: 1px solid #EFEFEF;
margin: 1px;
float: center;
width: 200px;
text-align: center;
}
.form-product-item img {
width: 150px;
height: 150px;
float: none !important;
margin: auto !important;
}
.form-product-item + br {
display:none;
}
br + b {
float: left;
padding-top: 20px;
}
.form-payment-total {
line-height: 50px;
margin: 1px;
border: 0px solid #EFEFEF;
border-radius: 4px;
padding: 15px;
padding-right: 193px;
padding-left: 6px;
}
.form-product-item .form-sub-label-container {
width: 200px !important;
}
span.form-sub-label-container input {
float: none !important;
}
Page URL: https://form.jotform.com/70545771946163 -
Chriistian Jotform SupportReplied on February 25, 2017 at 2:14 AM
On your custom CSS code, please try to add height: auto !important; on the .form-product-item CSS class.
.form-product-item {
border: 1px solid #EFEFEF;
margin: 1px;
float: center;
width: 200px;
text-align: center;
height:auto !important;
}
Do let us know if you need further assistance.
Regards. -
rcoughtreyReplied on February 25, 2017 at 7:46 AM
Spot on. looks perfect now thank you for your fast support