CSS forms change the height on a text field and not effect other text fields
- December 8, 2017
- 2 replies
- 15906 views
Hi there
Sorry I would like to change the height on the 'comments' field only, any suggestions on what to change in the CSS so it will enlarge the comments text field and not effect the other text fields? Please items attached below. Is it possible to use reference the ID field? (see line 53) If you would like to view the the full url please follow me and I can supply directly.
@Sanford Whiteman
.mktoForm {
width: 100% !important;
}
.mktoForm .mktoOffset {
float: left;
height: 1.2em;
}
mkto.FormRow {
float: left !important;
}
.mktoCheckboxList .mktoField[id^="mktoCheckbox"] {
align: left !important;
float: left !important;
clear: both;
margin-left: 0 !important;
}
.mktoForm div,
.mktoForm span,
.mktoForm p {
width: 100%;
}
.mktoForm input[type=text],
.mktoForm input[type=url],
.mktoForm input[type=tel],
.mktoForm input[type=email],
.mktoForm input[type=number],
.mktoForm input[type=date],
.mktoForm select.mktoField,
.mktoForm textarea.mktoField{
width:100% !important;
padding: 8.5px !important;
background-color: #f0f0f0 !important;
font-size: 13px;
color: #666666;
border: none;
box-shadow: none;
}
.mktoForm input[type=radio] {
margin-left: 0 !important;
}
.mktoForm input[type=checkbox] {
float: none;
clear: both;
margin-left: 0 !important;
}
}
.mktoForm input[id^="5126"] {
height:50px !important;
}
}
.mktoCheckboxList .mktoField[id^="mktoCheckbox"] {
align: left !important;
float: left !important;
clear: both;
margin-left: 0 !important;
}
.mktoForm .mktoCheckboxList {
float: left !important;
clear: both;
margin-left: 0 !important;
}
.mktoForm button.mktoButton {
background: linear-gradient(to bottom, #E21A23 0%,#E21A23 100%) !important;
border: 1px solid #E21A23 !important;
border: none;
class: btn btn-primary ${buttonStyle};
class:"btn btn-primary ${buttonStyle}";
font-family:'Helvetica Neue Roman' Helvetica, Arial, sans-serif !important;
padding: 10px 20px;
border-radius: 5px;
text-transform: uppercase;
font-size: 15px;
letter-spacing: 2px;
color: #fff;
}
@media only screen and (max-width: 480px) {
.mktoForm button.mktoButton {
margin-top: 0.5em !important;
}
@media only screen and (max-width: 480px) {
.mktoForm label {
align: left !important;
}
@media only screen and (max-width: 480px) {
.mktoForm .mktoCheckboxList {
align: left !important;
float: none;
ar: both;
margin-left: 0 !important;
@@@@@@d
.mktoRadioList .mktoField {
margin-bottom: 0.1em !important;
}
.mktoRadioList label {
margin-bottom: 0.1em !important;
}
@media screen and (max-width: 480px){
.mktoForm.mktoLayoutAbove input.mktoField[type="checkbox"],
.mktoForm.mktoLayoutAbove input.mktoLogicalField[type="checkbox"] {
width: auto !important;
height: auto !important;
}
}
@media screen and (max-width: 480px){
.mktoForm.mktoLayoutAbove .mktoFieldDescriptor.mktoFormCol {
margin-bottom: 5px !important;
}
}
.mktoForm.mktoLayoutAbove .mktoFieldDescriptor.mktoFormCol {
margin-bottom: 5px !important;
