Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Nov 2005
    Posts
    750
    Thanks
    138
    Thanked 1 Time in 1 Post

    Styling a form in Internet Explorer

    Hello

    I have an online form which appears different in IE from Safari (please see two screenshots attached). The form is here on a 'test' page:

    http://www.bayingwolf.com/India/contact.html

    The form should look the same in Explorer as it does in Safari (on Windows), but the shadow appears to be missing. How best to correct that, please?

    Here is the CSS:

    Code:
    input, textarea {   
        padding: 9px;  
        border: solid 1px #E5E5E5;  
        outline: 0;  
        font: normal 13px/100% Verdana, Tahoma, sans-serif;  
        width: 200px;  
        background: #FFFFFF url('bg_form.png') left top repeat-x;  
        background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));  
        background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);  
        box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
        -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
        -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
        }  
      
    textarea {   
        width: 400px;  
        max-width: 400px;  
        height: 150px;  
        line-height: 150%;  
        }  
      
    input:hover, textarea:hover,  
    input:focus, textarea:focus {   
        border-color: #C9C9C9;   
        -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;  
        }  
      
    .form label {   
        margin-left: 10px;   
        color: #999999;   
        }  
      
    .submit input {  
        width: auto;  
        padding: 9px 15px;  
        background: #617798;  
        border: 0;  
        font-size: 14px;  
        color: #FFFFFF;  
        -moz-border-radius: 5px;  
        -webkit-border-radius: 5px;  
        }
    Many thanks

    Steve
    Attached Thumbnails Attached Thumbnails Styling a form in Internet Explorer-ie.jpg   Styling a form in Internet Explorer-safari.jpg  

  • #2
    New to the CF scene
    Join Date
    Jan 2014
    Location
    USA
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I looked at the site in IE 9 and the shadow is less noticeable than in chrome or Firefox, but it is still there. I would suggest if this bugs you, to make a browser sniffer to detect if IE is used to make the shadow darker when viewed. Another possibility is that your IE isn't working right. Press F12 to access developer tools and make sure IE is in the correct standards mode.

    See the buttons circled? If they don't say the correct version, click them to change.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •