Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it
    Registrato dal
    Jul 2005
    Messaggi
    2,469

    scroll verticale non funziona

    Salve
    ho questo codice:
    codice:
    .contenitor {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width:90%;
    }
    .contenitor:before {
        content: "";
        position: absolute;
        z-index: -1;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: url('../../public/sfondo_home.png') no-repeat center;
        opacity: .2
    }
    codice:
    <div class="contenitor" >
    <div class="bg"></div>
    <p align="center"><img border="0" src="IMGLOGO.jpg" style="max-width:350px;" ><br><BR><br>
    <font">nomecognome</font><br>
    <img border="0" src="IMMAGINE.JPG>" style="max-width:350px;" >
    <form class="ebutton" method="POST" action="menu.asp">
    <p align="center">
    <button type="submit">Menù</button>
    </form>
    </div>
    Inserito in una pagina web responsive, non fa scrollare verticalmente, come mai?
    Dove sbaglio?
    Grazie

  2. #2
    Utente di HTML.it
    Registrato dal
    Jul 2005
    Messaggi
    2,469
    nessun aiuto?

  3. #3
    Utente di HTML.it L'avatar di ninja72
    Registrato dal
    May 2020
    residenza
    -
    Messaggi
    119
    penso che il problema si position: fixed; prova a centrare il tutto con flex.
    codice:
    <!DOCTYPE html>
    <html lang="it">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>page test</title>
        <style>
            html,
            body {
                height: 100%;
                padding: 0;
                margin: 0;
            }
    
            .contenitor {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 100%;
            }
    
            .contenitor:before {
                content: "";
                position: absolute;
                z-index: -1;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                background: url('../../public/sfondo_home.png') no-repeat center;
                opacity: .2;
            }
    
            .bg {
                width: 100%;
                text-align: center;
            }
    
            .myimg {
                border: 0;
                max-width: 350px;
            }
    
            .ebutton {
                padding: 20px 0;
            }
        </style>
    </head>
    
    <body>
        <div class="contenitor">
            <div class="bg">
                <img class="myimg" src="IMGLOGO.jpg" alt="IMGLOGO">
                <p>nome cognome</p>
                <img class="myimg" src="IMMAGINE.JPG" alt="IMMAGINE">
                <form class="ebutton" method="POST" action="menu.asp">
                    <button type="submit">Menù</button>
                </form>
            </div>
        </div>
    
    </body>
    
    </html>

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.