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

    input e le dimensioni del padre

    Mi spiegate perchè i campi input non prendono le stesse dimensioni del del contenitore padre?

    Cioè mi spiego se gli do un "width: 100%" e sempre più lungo del contenitore padre

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,674
    Dipende dal box-sizing che è una caratteristica del box model.

    La spiegazione è che nel valore della proprietà width (di qualsiasi elemento e anche per la proprietà height) di norma non è considerato l'ingombro creato dalle proprietà border e/o padding. L'elemento input dovrebbe avere di default un valore impostato per entrambe queste proprietà, per cui width:100% è applicato considerando la larghezza (del padre) al netto di queste due proprietà (sia del padre che del figlio).

    La soluzione è quella di applicare, sull'input, la proprietà box-sizing:border-box che risolve il problema.

    Nota che ultimamente su alcuni framework (vedi bootstrap) tale proprietà viene ridefinita in questo modo per ottenere un migliore box model di base. Generalmente puoi trovare una roba del genere:
    codice:
    * { box-sizing:border-box;}
    Ultima modifica di KillerWorm; 12-03-2018 a 12:15
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

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