forms - extra padding/margin fix for IE

Discussion in 'HTML and CSS' started by martus42, Mar 7, 2011.

  1. martus42

    martus42

    Joined:
    Mar 7, 2011
    Messages:
    1
    Please, could anyone help me with fixing it? Thanks!!!

    /*Defaults Styling*/

    /* Fix IE. Hide from IE Mac \*/
    * html ul li { float: left; }
    * html ul li a { height: 1%; }
    /* End */

    fieldset {
    background:#f2f2e6;
    padding:10px;
    border:1px solid #fff;
    border-color:#fff #666661 #666661 #fff;
    margin-bottom:36px;
    width:600px;
    }

    <!--[if IE]>
    <style>
    fieldset {
    margin-bottom:36px;
    padding: 10px;
    }
    </style>
    <![EndIf]-->

    input, textarea, select {
    font:12px/12px Arial, Helvetica, sans-serif;
    padding:0;
    }
    fieldset.action {
    background:#fff;
    border-color:#e5e5e5 #797c80 #797c80 #e5e5e5;
    margin-top:-20px;
    }

    <!--[if IE]>
    <style>
    fieldset.action {
    margin-top: -20px;
    }
    </style>
    <![EndIf]-->

    legend {
    background:#bfbf30;
    color:#fff;
    font:17px/21px Calibri, Arial, Helvetica, sans-serif;
    padding:0 10px;
    margin:-26px 0 0 -11px;
    font-weight:bold;
    border:1px solid #fff;
    border-color:#e5e5c3 #505014 #505014 #e5e5c3;
    }
    label {
    font-size:11px;
    font-weight:bold;
    color:#666;
    }
    label.opt {
    font-weight:normal;
    }
    dl {
    clear:both;
    }
    dt {
    float:left;
    text-align:right;
    line-height:25px;
    margin:0 5px 5px 0;
    }
    dd {
    float:left;
    width:475px;
    line-height:25px;
    margin:0 0 5px 0;
    }
    /*##########################################
    Script: Niceforms 2.0
    Theme: StandardBlue
    Author: Lucian Slatineanu
    URL: http://www.emblematiq.com/
    ##########################################*/

    /*Text inputs*/
    .NFText {
    border:none;
    vertical-align:middle;
    font:12px/15px Arial, Helvetica, sans-serif;
    background:none;
    }
    .NFTextCenter {
    height:15px;
    background:url(img/input.png);
    background-repeat:repeat-x;
    padding:3px 0;
    margin:0;
    float:left;
    line-height:15px;
    }
    .NFTextLeft, .NFTextRight {
    width:7px;
    height:21px;
    vertical-align:middle;
    float:left;
    }
    .NFTextLeft {
    background:url(img/input-left.png) no-repeat 0 0;
    }
    .NFTextRight {
    background:url(img/input-right.png) no-repeat 0 0;
    }
    /*Radio*/
    .NFRadio {
    cursor:pointer;
    position:absolute;
    display:block;
    width:13px;
    height:13px;
    border:1px solid transparent;
    background:url(img/radio.png) no-repeat 0 0;
    z-index:2;
    }
    /*Checkbox*/
    .NFCheck {
    cursor:pointer;
    position:absolute;
    width:12px;
    height:12px;
    border:1px solid transparent;
    background:url(img/checkbox.png) no-repeat 0 0;
    z-index:2;
    }
    /*Buttons*/
    .NFButton {
    width:60px;
    height:26px;
    color:#fff;
    background:url(img/button.png) repeat-x center 1px;
    cursor:pointer;
    font:bold 10px/26px Tahoma, Arial, Helvetica, sans-serif;
    text-transform:uppercase;
    vertical-align:middle;
    border: solid 0;
    }
    .NFButtonLeft, .NFButtonRight {
    width:6px;
    height:26px;
    vertical-align:middle;
    }
    .NFButtonLeft {
    background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 0 1px;
    }
    .NFButtonRight {
    background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 0 1px;
    }
    /*Textareas*/
    .NFTextarea {
    border:1px;
    border-color: #000000;
    background:none;
    font:12px/12px Arial, Helvetica, sans-serif;
    margin:0;
    }
    .NFTextareaTop, .NFTextareaBottom {
    height:5px;
    clear:both;
    float:none;
    padding-right:5px;
    }
    .NFTextareaTop {
    background:url(img/textarea-tr.png) no-repeat 100% 0;
    }
    .NFTextareaBottom {
    background:url(img/textarea-br.png) no-repeat 100% 0;
    margin-bottom:5px;
    }
    .NFTextareaTopLeft, .NFTextareaBottomLeft {
    width:5px;
    height:5px;
    }
    .NFTextareaTopLeft {
    background:#f2f2e6 url(img/textarea-tl.png) no-repeat;
    background-position: 0 0;
    }
    .NFTextareaBottomLeft {
    background:#f2f2e6 url(img/textarea-bl.png) no-repeat;
    background-position: 0 0;
    }
    .NFTextareaLeft, .NFTextareaRight, .NFTextareaLeftH, .NFTextareaRightH {
    float:left;
    padding-bottom:5px;
    }
    .NFTextareaLeft, .NFTextareaLeftH {
    width:5px;
    }
    .NFTextareaLeft {
    background:url(img/textarea-l-off.png) repeat-y;
    background-position:0 0;
    }
    .NFTextareaLeftH {
    background:url(img/textarea-l-over.png) repeat-y 0 0;
    }
    .NFTextareaRight, .NFTextareaRightH {
    padding-right:0px;
    padding-bottom:0;
    }
    .NFTextareaRight {
    background:url(img/textarea-r-off.png) repeat-y 100% 0%;
    }
    .NFTextareaRightH {
    background:url(img/textarea-r-over.png) repeat-y 100% 100%;
    }
    /*Files*/
    .NFFileButton {
    padding-bottom:0;
    vertical-align:bottom;
    cursor:pointer;
    background:url(img/file.png) no-repeat 0 0;
    width:60px;
    height:21px;
    }
    .NFFile {
    position:relative;
    margin-bottom:5px;
    }
    .NFFile input.NFhidden {
    position:relative;
    filter: alpha(opacity=0);
    opacity:0;
    z-index:2;
    cursor:pointer;
    text-align:left;
    }


    .NFFileNew {
    position:absolute;
    top:0px;
    left:0px;
    z-index:1;
    }
    /*Selects*/
    .NFSelect {
    background-color: #fff;
    height:21px;
    position:absolute;
    border:solid 1px transparent;
    }
    .NFSelectLeft {
    background: url(img/select-right.png) no-repeat;
    width: 3px;
    float:left;
    height:21px;
    margin: 0;
    padding: 0;
    border-color: #dddfdf;
    border-style: solid;
    border-width: 1px 0 1px 1px;
    }
    .NFSelectRight {
    overflow:hidden;
    height:21px;
    width:auto;
    background:#fff url(img/select-right.png) no-repeat 100% 0;
    cursor:pointer;
    font:11px/21px Arial, Helvetica, sans-serif;
    color:#666;
    margin-left: 4px;
    padding-right: 4px;
    padding-left: 1px;
    border-color: #dddfdf;
    border-style: solid;
    border-width: 1px 1px 1px 0;
    }
    .NFSelectTarget {
    background: #fff;
    position:absolute;
    z-index:3;
    left:0;
    top:0;
    margin: 0px;
    padding: 2px 2px 5px 2px;
    border: solid 1px #DDDFDF;
    }
    .NFSelectOptions {
    max-height: 250px;
    overflow: auto;
    position:relative;
    list-style:none;
    color:#666;
    font:11px/13px Arial, Helvetica, sans-serif;
    z-index:4;
    left:0;
    top:0;
    margin: 0;
    }
    .NFSelectOptions li {
    width:auto;
    min-width: 50px;
    margin: 0;
    padding: 2px 2px 5px 2px;/*padding: 8px;*/
    }
    .NFSelectOptions a {
    display:block;
    text-decoration:none;
    color:#666;
    height: 17px;
    margin: 0 0 0px 0;
    padding: 2px 2px 5px 2px;
    }
    .NFSelectOptions a.NFOptionActive {
    margin: 0;
    font-weight: bold
    }
    .NFSelectOptions a:hover {
    margin: 0;
    background-color: #FC0;
    padding: 2px 2px 5px 2px;/*padding: 8px;*/
    }
    option.dropdown {
    background-color: #adde02;
    width: 150px;
    }
    /*Multiple Selects*/
    .NFMultiSelect {
    border:0;
    background:none;
    margin:0;
    }
    .NFMultiSelectTop, .NFMultiSelectBottom {
    height:5px;
    clear:both;
    float:none;
    padding-right:10px;
    }
    .NFMultiSelectTop {
    background:url(img/textarea-tr.png) no-repeat 100% 0;
    }
    .NFMultiSelectBottom {
    background:url(img/textarea-br.png) no-repeat 100% 0;
    margin-bottom:5px;
    }
    .NFMultiSelectTopLeft, .NFMultiSelectBottomLeft {
    width:5px;
    height:5px;
    }
    .NFMultiSelectTopLeft {
    background:#f2f2e6 url(img/textarea-tl.png) no-repeat 0 0;
    }
    .NFMultiSelectBottomLeft {
    background:#f2f2e6 url(img/textarea-bl.png) no-repeat 0 0;
    }
    .NFMultiSelectLeft, .NFMultiSelectRight, .NFMultiSelectLeftH, .NFMultiSelectRightH {
    float:left;
    padding-bottom:5px;
    }
    .NFMultiSelectLeft, .NFMultiSelectLeftH {
    width:5px;
    }
    .NFMultiSelectLeft {
    background:url(img/textarea-l-off.png) repeat-y 0 0;
    }
    .NFMultiSelectLeftH {
    background:url(img/textarea-l-over.png) repeat-y 0 0;
    }
    .NFMultiSelectRight, .NFMultiSelectRightH {
    padding-right:5px;
    padding-bottom:0;
    }
    .NFMultiSelectRight {
    background:url(img/textarea-r-off.png) repeat-y 100% 0;
    }
    .NFMultiSelectRightH {
    background:url(img/textarea-r-over.png) repeat-y 100% 0;
    }
    /*Focused*/
    .NFfocused {
    border:1px dotted #666;
    }
    /*Hovered*/
    .NFh {
    background-position:0 100%;
    }
    .NFhr {
    background-position:100% 100%;
    }
    /*Hidden*/
    .NFhidden {
    opacity:0;
    z-index:-1;
    position:relative;
    }
    /*Safari*/
    select, input, textarea, button {
    resize: none;
    }
    select.drop {
    background-color: #adde02;
    width: 115px;
    }
     
    martus42, Mar 7, 2011
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.

Share This Page