faradrim
Member
Hi there,
got a problem with the CSS of easy contact in IE6, IE7 and IE8. On the top of the fieldsets is a 10px overlapping/overflow of the grey background. Is that a bug? How can I fix that? I'm trying around for more than one hour, now.
Please take a look on that screenshot:
http://screencast.com/t/MWJjOGQyM
Thank you for your effort.
faradrim
Member
Thanks for the link, but I cannot fix it. I did this in my child-theme, according the instructions:
body div.formcontainer form.contact-form fieldset {
position: relative;
background: #F6F6F6;
color: #333333;
margin: 0.5em 0 1.5em 0;
}
body div.formcontainer form.contact-form fieldset legend {
position: absolute;
top: -.5em;
left: .2em;
text-transform: uppercase;
}
and got this:
vfxdude
admin
adjust the top attribute a bit...
and you have to add it like this http://www.communitymx.com/content/article.cfm?page=3&cid=DD9F3. If you are doing it from a childtheme you can send it to heading.php with a hook (add the code in functions.php), like this:
function css_fix() { ?>
<!--[if IE]>
<style>
....
<?php
}
add_action( 'wp_head', 'css_fix' );
You can not add it to style.css since it got to be filtered out for the other browsers...
faradrim
Member
Okay... I played around a bit. It's not the most beautiful piece of code, but it is working with my child-css.
/* hack for contact-form fieldset IE6/7/8 */
body div.formcontainer form.contact-form fieldset {
position: relative\9;
margin-top: .5em\9;
margin-bottom: 3em\9;
}
body div.formcontainer form.contact-form fieldset legend {
position: absolute\9;
top: -1.2em\9;
left: .2em\9;
margin-bottom: 10px\9;
}
div.form-label {
padding-top: .9em\9 !important;
}
.information {
margin-bottom /*\**/: 37px\9;
}
* html .information {
margin-bottom: 33px;
}
/* end of hack for contact-form fieldset IE6/7/8 */
You must log in to post.