Menu senza Background in IE6

**mlolcu** · 17-05-2014, 18:14

Buongiorno, potreste dirmi per favore perchè in IE6 non ho un background:rgb(255,255,255) mentre invece lo vedo nel div class="content"?
Dove ho sbagliato?
Grazie mille!

codice HTML:

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Chi siamo</title>
<base target="_self">
<link href="css/stili.css" rel="stylesheet" type="text/css">

<!--[if IE]>
    <style type="text/css">
        .content {
        background: rgb(255,255,255); 
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
        filter:alpha(opacity=50); 
        zoom:1;

        .menu {
        background: rgb(255,255,255); 
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
        filter:alpha(opacity=50); 
        zoom:1;

    }
    </style>
<![endif]-->


</head>

<body>

<div class="menu">
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="ChiSiamo.htm">About</a></li>
        <li><a href="Archivio.htm">Archivio</a></li>
        <li><a href="Contatti.htm">Contatti</a></li>
    </ul>
</div> <!--fine menu-->

<div class="container">
    <div class="content" align="justify">
        <p>testo...</p>
    </div> 
</div>

<div id="background">
    <table cellpadding="0" cellspacing="0">
        <tr>
            <td><img src="images/sfondo1.jpg" id="bgk" alt="" /> </td>
        </tr>
    </table>
</div>


</body>
</html>

codice:

* {
    margin:0;
    border:0;
    padding:0;
}

html,body{
    width:100%;
    height: 100%;
    background-color:transparent;
    color:rgb(0,0,0);
    overflow:hidden;
}

body {text-align: center;}

.menu {
    width:100px;
    float:left;
    display:inline;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
    margin: 0;
    box-shadow: 0px 4px 10px 0px rgb(90,90,90);
    padding-top: 30px;
    background:rgba(200,200,200,0.5);
    font-family: Lucida Sans Unicode,Verdana,Arial;
    font-size: 12px;
}

.menu li a {
  color: rgb(255,255,255);
  display:block;
  line-height: 10px;
  height: 30px;
  width: 100px;
  text-align: center;
  text-decoration: none;
}
 
.menu li a:hover {  font-weight: bold;}

.container{
    width:100%;
    height: 100%;
    position:relative;
    top:0;
    left:0;
    overflow:auto;
    z-index:1;
}

.content{
    overflow:auto;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 30px;
    padding-bottom: 100px;
    border-left: 0;
    border-right: 0;
    font-family: Verdana,Lucida Sans Unicode,Arial;
    font-size: 12px;
    text-aling: left;
    background: rgba(255,255,255,0.5) ;
    margin-left: 100px;
    margin-right: 10%;
    box-shadow: 4px 4px 10px 0px rgb(90,90,90) ;
}

#background{
    position:absolute;
    top:0;
    left:0;
    z-index:0;
}

**AlexDev** · 18-05-2014, 12:21

da quanto leggo su internet, sembra che internet explorer 7(e precedenti) abbiano un bug nella lettura del colore rgb.. leggi qui per altre info: http://css-tricks.com/ie-background-rgb-bug/

**mlolcu** · 18-05-2014, 18:47

Grazie, ho risolto il problema sudiando questo fantastico sito:

http://www.cssportal.com/css3-menu-generator/

**AlexDev** · 18-05-2014, 21:25

davvero interessante, grazie per averlo linkato ^^

Discussione: Menu senza Background in IE6

Strumenti discussione

Ricerca discussione

Visualizza

Menu senza Background in IE6

Permessi di invio