Visualizzazione dei risultati da 1 a 4 su 4
  1. #1

    Dubbio su layout liquido

    Ciao ragazzuoli,
    una domanda banale...

    ho fatto una prova di layout fluido dentro il quale ho inserito un form di larghezza 500px.

    È normale che stringendo molto la finestra il bordo del contenitore principale si sovrapponga al form? Oppure si dovrebbe fermare ad altezza del form?

    Grazie e scusate della banalità...

    codice:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
      <head>
      <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
      
      <link rel="stylesheet" type="text/css" href="css.css">  
        <title></title>
      </head>
      <body>
    
        <div id="centrato">
          <div id="header"></div>
          <div id="content">
                    <div id="form">
              <form action="login.php" method="post" class="login">
                <fieldset>
                  <legend>Accedi</legend>
                  
    1. <label for="uname">Username</label> <input id="uname" name="uname">
    2. <label for="password">Password</label> <input id="passw" type="password" name="passw">
    <input type="submit" class="submit" value="Invio"> </fieldset> </form> </div> </div> <div id="footer"></div> </div> </body> </html>
    codice:
    body {
      margin: 0;
      padding: 0;
    }
    
    #centrato {
      margin: 0 10%;
      border: 2px solid red;
      min-height: 600px; 
    }
    
    #header {
      border: 2px solid black;
      background: green;
      height: 100px;
    }
    
    #content {
      min-height: 400px;
    }
    
    #content #form {
      margin:0px 10%;
    }
    
    #footer {
      border: 2px solid blue;
      background: red;
      height: 100px;
    }

  2. #2
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Dove sta scritto che il form e` largo 500px?
    Credo che se veramente deve essere non piu` stretto di un tot, dovresti dirglielo, ad esempio con un min-width nel CSS corrispondente, eventualmente specificando anche overflow:auto
    Dato il tipo di dati contenuto, forse dovresti usare gli em, come unita` di misura, non i px.

    Inoltre mi par di vedere un errore di logica (causato da errore di distrazione):
    <label for="password">Password</label> <input id="passw" ...
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

  3. #3
    Mi sono pappato il codice con la larghezza del form nell'incollare....

    Quanto a min-width, è supportata correttamente dai vari browser?

    Grazie mille

  4. #4
    Utente di HTML.it
    Registrato dal
    Sep 2001
    Messaggi
    21,188
    Originariamente inviato da pezzo
    Mi sono pappato il codice con la larghezza del form nell'incollare....
    Ah ecco perche` ..

    Quanto a min-width, è supportata correttamente dai vari browser?
    No, ma si puo` usare il solito hack senza problemi: e` un hack a prova di futuro (cosi` dicono i guru):

    width: auto !important;
    width: 500px;
    min-width: 500px;
    Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
    No domande tecniche in messaggi privati

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 © 2026 vBulletin Solutions, Inc. All rights reserved.