cforms css, firefox vs IE
-
I used Firebug to change the CSS in cforms. Everything looks great in Firefox, but I can’t get the checkboxes to align in IE. Here’s the CSS.
@import “calendar.css”;
.cform {
margin:0;
width:485px;
}
.cform fieldset {
background:#F7F7F7 none repeat scroll 0 0;
border-color:#ECECEC #ADADAD #ADADAD #ECECEC;
border-style:solid;
border-width:0;
margin:10px 0 0;
padding:5px 0 15px;
}
.cform .cf_hidden {
background:transparent none repeat scroll 0 0 !important;
border:medium none !important;
display:none;
margin:0 !important;
padding:0 !important;
}
.cform legend {
color:#666666;
font-family:Times;
font-size:26px;
font-size-adjust:none;
font-stretch:normal;
font-style:normal;
font-variant:normal;
font-weight:bold;
line-height:normal;
margin-left:10px;
padding:0 15px;
}
ol.cf-ol {
margin:0 !important;
padding:0 !important;
}
ol.cf-ol li {
background:transparent none repeat scroll 0 0 !important;
line-height:1.3em;
list-style-image:none !important;
list-style-position:outside !important;
list-style-type:none !important;
margin:5px 0 !important;
padding:0;
text-align:left;
}
ol.cf-ol li.textonly {
background:#F0F0F0 none repeat scroll 0 0 !important;
letter-spacing:1px;
margin:10px 0 !important;
padding:5px 20px 10px;
text-align:left;
}
.cform label {
display:inline;
margin:2px 26px 0 30px;
text-align:left;
vertical-align:top;
width:410px;
}
.cform label span {
display:block;
width:384px;
}
label.cf-before {
margin:4px 10px 0 0;
}
label.cf-after {
margin:4px 15px 0 6px;
text-align:left;
width:115px;
}
label.cf-after span {
display:block;
width:115px;
}
label.cf-group-after {
display:inline;
width:250px;
}
label.cf-group-after span {
display:inline-block;
width:410px;
}
.cform input, .cform textarea, .cform select {
background:#F9F9F9 none repeat scroll 0 0;
border:1px solid #888888;
padding:3px;
vertical-align:top;
}
.cform input:hover, .cform textarea:hover, .cform select:hover {
background:#CEDDDF none repeat scroll 0 0;
}
.cform input:focus, .cform textarea:focus, .cform select:focus {
background:#F3F8F8 none repeat scroll 0 0;
}
.cform textarea, .cform input {
font-family:inherit;
font-size:inherit;
font-size-adjust:inherit;
font-stretch:inherit;
font-style:inherit;
font-variant:inherit;
font-weight:bold;
letter-spacing:0;
line-height:inherit;
margin-left:30px;
margin-top:7px;
padding:4px;
width:240px;
}
.cform select {
padding:2px 0;
width:158px;
}
.cform select.cfselectmulti {
height:7.5em;
}
.cform textarea {
font-family:arial;
font-size:0.9em;
overflow:auto;
width:340px;
}
ol.cf-ol li.cf-box-title {
font-weight:bold;
letter-spacing:1px;
padding:8px 0 0 30px;
}
.cform input.cf-box-a, .cform input.cf-box-b {
background:transparent none repeat scroll 0 0 !important;
border:medium none !important;
height:22px;
margin:2px 0 0;
width:14px;
}
.cform input.cf-box-a {
margin-left:100px;
}
ol.cf-ol li.cf-box-group {
margin:10px 0 0 !important;
padding-left:30px;
}
span.reqtxt, span.emailreqtxt {
color:#999999;
display:-moz-inline-box;
font-size:10px;
margin:4px 0 0 3px;
vertical-align:top;
}
p.cf-sb {
background:#F7F7F7 none repeat scroll 0 0;
margin:0;
padding:0 !important;
text-align:center;
}
.cform input.backbutton, .cform input.resetbutton, .cform input.sendbutton {
background:transparent url(../images/button-bg.gif) repeat-x scroll 0 0;
border-color:#ECECEC #ADADAD #ADADAD #ECECEC !important;
border-style:solid !important;
border-width:1px !important;
font-size:16px;
margin:0 0 10px;
padding:2px;
width:200px;
}
.cform input.resetbutton {
padding:5px 1em;
width:auto;
}
.cform input.backbutton {
padding:5px 1em;
width:auto;
}
ol.cf-ol li.cf_li_err {
background:#FFDFDF url(li-err-bg.png) repeat scroll 0 0 !important;
border-color:#DF7D7D;
border-style:solid;
border-width:1px 0;
margin:5px 0 !important;
padding:5px 0 !important;
}
ol.cf-ol li ul.cf_li_text_err {
color:#333333;
height:1%;
margin:0 0 0 100px;
min-height:1%;
padding:0;
}
ol.cf-ol ul.cf_li_text_err li {
background:transparent url(icon-alert.png) no-repeat scroll left 1px !important;
font-weight:bold;
list-style-image:none !important;
list-style-position:outside !important;
list-style-type:none !important;
margin:0 0 2px !important;
padding-left:15px;
text-indent:0;
}
ol.cf-ol ul.cf_li_text_err li:before {content:”;
}
label.secq, label.seccap {
margin-bottom:4px;
vertical-align:text-bottom;
}
input.secinput {
vertical-align:text-bottom;
}
#cforms_captcha6, #cforms_captcha5, #cforms_captcha4, #cforms_captcha3, #cforms_captcha2, #cforms_captcha {
height:15px;
margin:0;
padding:4px;
width:50px;
}
img.captcha {
border:medium none !important;
float:none !important;
margin:0 0 0 10px !important;
padding:0 !important;
vertical-align:text-bottom;
}
img.captcha-reset {
background:transparent url(captcha_reset_grey.gif) no-repeat scroll 0 0;
border:medium none;
height:21px;
margin:0 0 2px 3px;
vertical-align:text-bottom;
width:21px;
}
img.imgcalendar {
border:medium none;
}
div.cf_info {
color:#333333;
display:none;
line-height:1.3em;
margin:10px auto;
padding:10px 15px !important;
width:380px;
}
div.cf_info ol {
margin:0;
padding:5px 15px 0 30px;
}
div.cf_info ol li {
margin:2px 0;
padding:1px 0;
}
div.cf_info a {
color:#AD2929 !important;
text-decoration:underline !important;
}
div.success {
background:#F7F7F7 none repeat scroll 0 50%;
color:#FF0000;
display:block;
font-size:20px;
font-weight:bold;
}
div.failure {
background:#FFDFDF url(li-err-bg.png) repeat scroll 0 0 !important;
border-color:#DF7D7D;
border-style:solid;
border-width:1px 0;
display:block;
}
div.waiting {
background:#F9F9F9 none repeat scroll 0 0;
color:#AAAAAA;
display:block;
}
.cform .cf_error {
border:1px solid #AD2929;
color:#AD2929;
}
div.mailerr {
display:block;
}
.mailerr, .cform .cf_errortxt {
color:#AD2929;
}
[disabled] {
background:transparent none repeat scroll 0 0 !important;
border-color:#DDDDDD !important;
color:#DDDDDD;
}
.disabled {
border-color:#DDDDDD !important;
}
.cform input.cf_upload {
background:#F9F9F9 none repeat scroll 0 0;
border:1px solid #888888;
width:220px;
}
.linklove {
margin:0 auto 10px !important;
padding:0 !important;
text-align:center !important;
width:410px;
}
.linklove a, .linklove a:visited {
color:#AAAAAA !important;
font-family:Tahoma;
font-size:0.8em;
}
* html .cform fieldset {
margin-top:15px;
padding-top:25px;
position:relative;
}
* html .cform legend {
left:10px;
margin-left:0;
position:absolute;
top:-10px;
}
* + html .cform fieldset {
margin-top:15px;
padding-top:25px;
position:relative;
}
* + html .cform legend {
left:10px;
margin-left:0;
position:absolute;
top:-10px;
}
* html ol.cf-ol, * html ol.cf-ol li, * html span.reqtxt, * html span.emailreqtxt {
display:inline-block;
}
* + html .cform label, * + html ol.cf-ol, * + html ol.cf-ol li, * + html span.reqtxt, * + html span.emailreqtxt {
display:inline-block;
}
* html img.captcha {
margin-bottom:1px !important;
}
* + html img.captcha {
margin-bottom:1px !important;
}Does anybody know the problem?
Thanks!
- The topic ‘cforms css, firefox vs IE’ is closed to new replies.