Problema transparent

**PuntaT** · 11-08-2016, 13:38

Buongiorno,

Ho un piccolo problema nel mio menï¿½.
Pur avendo impostato il bg-color transparent nel foglio di stile del sito, rimane un piccolo sfondo dietro le varie immagini che creano il menï¿½.
Vi lascio uno screen della pagina per capire meglio:

http://it.tinypic.com/r/347dufm/9

Vi lascio il codice del lavoro fino ad adesso:

Home.php

codice:

<html>
    <head>        
      <meta charset="utf-8">             
      <title> Italia Sport - Serie A </title>             
      <link rel="stylesheet" href="style/monitor.css" media="screen">            
    </head>
    <body>    
      <header>        
        <?php            
          include 'Menu.php';        
        ?>    
      </header>    
     </body>
</html>

Menu.php

codice:

<div id="menu">
<hgroup>
    <div>
        <table>
            <tr>
                <td width="5%">
                    <img src="img/seriea.png" width="100">
                </td>
                <td width="80%" align="center">
                    <img src="img/logo.png" width="150">
                </td>
                <td width="15%">
                    <form>
                        <fieldset>
                        <label>Mail</label>
                        <input type=email placeholder="example@domain.com" required>
                        <label>Password</label>
                        <input type=password required>
                        <input type=submit name="Login">
                        </fieldset>
                    </form>
                </td>
            </tr>
        </table>
    </div>
    </hgroup>
        <nav>
        <ul id="menu">
            <li><a href="Squadre/atalanta.html"><img id="1" src="img/atalanta.png" width="15">&nbsp<!--Atalanta--></a><ul><li><a href="#">Atalanta</a></li></ul></li>
            ...Uguali le altre!
        </ul>
        </nav>
</div>

monitor.css

codice:

ul#menu {    font-family: Verdana, sans-serif;
    font-size: 12px;
    margin: 7px;
    padding: 3px;
    list-style: none;
}
  
ul#menu li {
    background-color: transparent;
    border-bottom: 5px solid transparent;
    display: block;
    width: 50px;
    height: 23px;
    margin: 7px;
    /* border-bottom-left-radius:5px;
    border-top-right-radius:5px; */
    float: left;
}
  
ul#menu li a {
    color: #fff;
    display: block;
    font-weight: bold;
    line-height: 30px;
    text-decoration: none;
    width: 50px;
    height: 23px;
    text-align: center;
}
  
ul#menu li.active, ul#menu li:hover {
    background-color: transparent;
    border-bottom: 5px solid transparent;
}


ul#menu img:hover{
    width: 50px;
    transition: all 300ms linear;
}


ul#menu ul {
    visibility: hidden;
    
}


ul#menu li:hover ul{
    visibility: visible;
}


img#1{
    height: 70px;
}


img#2{
    height: 55px;
}


div#classifica {
 width: 200px;
 padding-left: 10px;
 padding-right: 10px;
 padding-top: 10px;
 padding-bottom: 10px;
 border-top: 2px solid white;
 border-bottom: 2px solid white;
 border-left: 2px solid white;
 border-right: 2px solid white;
}


body, body a{
    background-image: url(../img/sfondohead.jpg);
    color: #fff;
}

**ResianTaxidrive** · 11-08-2016, 21:18

dallo screenshot non è che si capisca granchè, comunque forse sono le png che non sono fatte bene.

**PuntaT** · 12-08-2016, 11:08

Originariamente inviata da ResianTaxidrive

dallo screenshot non è che si capisca granchè, comunque forse sono le png che non sono fatte bene.

Purtroppo sono stato costretto a ridurre la qualità dell'immagine, comunque mi sembra si veda bene che dietro le immagini ci sia un rettangolo blu più scuro!
Le png sono fatte bene, perché sia nell'animazione che precedentemente, il problema non si è proposto...

**ResianTaxidrive** · 16-08-2016, 21:13

Ok, scusa, ho dovuto inclinare lo schermo per riuscire a vedere. Ma le png hanno lo sfondo trasparente?

Discussione: Problema transparent

Strumenti discussione

Ricerca discussione

Visualizza

Problema transparent

Permessi di invio