Colorless IE table

1

I have a problem on the IE11 page because the rectangle appears to White and Chrome appears correctly.

<formmethod="post" action="Procurarquery.php"  enctype="multipart/form-data">

           

CSS:

.Tabela {
background: #7db9e8; /* Old browsers */
background: -moz-linear-gradient(top, #7db9e8 1%, #1e5799 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-  stop(1%,#7db9e8),color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /*   Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /* IE10+ */
background: linear-gradient(to bottom, #7db9e8 1%,#1e5799 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8',   endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */
 }
    
asked by anonymous 19.05.2014 / 10:45

1 answer

1

The problem is in CSS, what you posted is incomplete. Notice that what you posted applies a solid color and not a gradient as in the image.

<table style="width:100%;height:100%;background-color:#4682B4;" bgcolor="#4682B4" ...
background-color:#4682B4;
bgcolor="#4682B4"

Make sure your CSS is compatible with IE, see a cross browser example:

background: #7db9e8; /* Old browsers */
background: -moz-linear-gradient(top, #7db9e8 1%, #1e5799 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#7db9e8),color-stop(100%,#1e5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #7db9e8 1%,#1e5799 100%); /* IE10+ */
background: linear-gradient(to bottom, #7db9e8 1%,#1e5799 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */

See the above code here: jsfiddle.net/wLV65/

Note that height 100% inherits the height of the parent, that is, if the parent does not have a defined height, the child will also not have it and this is enough for the gradient not to be applied in IE. Try changing the height 100% for a fixed height, it will work in IE.

    
19.05.2014 / 11:20