2010-07-02 18 views
25

Controlla quanto lontano ho ottenuto qui: [il collegamento è stato rimosso] Come posso rendere la textarea sopra il pulsante verde per riempire il blocco div? Voglio dire, come rendere la textarea esattamente della stessa larghezza del blocco dei commenti?Come creare un'area di testo per riempire il blocco div?

+1

Prova a dargli un 'larghezza: 100%' –

+2

Se sarebbe così semplice. Comunque, aggiunto. Controlla il link. : P – Rihards

+1

'width: 100%' provoca un overflow. Si può semplicemente impostare la larghezza a 488px, che è la larghezza delle altre caselle. Non ho controllato per vedere perché esso trabocca però - risolvendo che potrebbe essere una soluzione migliore. – Mike

risposta

42

prega di fare riferimento a questo articolo, che implementa la proprietà box-sizing CSS3 http://css-tricks.com/box-sizing/

Una soluzione rapida per questo è di impostare

textarea { 
    width: 100%; 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ 
    -moz-box-sizing: border-box; /* Firefox, other Gecko */ 
    box-sizing: border-box;   /* Opera/IE 8+ */ 
} 

Ed ecco un esempio di lavoro che implementa il box-sizing proprietà http://css-tricks.com/examples/BoxSizing/

L'utilizzo di larghezze come 99% o leggermente inferiori per regolare all'interno del contenitore div è già stato scoraggiato.

+0

Soluzione bella e pulita, grazie! MA "Supporto IE8 +: dimensionamento della scatola" ... Ricorda che ho scritto la risposta di cui sopra due anni fa quando IE8 era l'ultima versione. E anche ora potresti avere molti utenti che eseguono XP + IE6 a seconda dei tuoi clienti. – Vinz

+0

@Vinz, è vero per la tua preoccupazione. Tuttavia, credo che "l'uso di un vecchio browser è di soffrire da solo". Se IE non supporta, quindi il problema di IE, perché dovrebbe essere il nostro problema :) - – acpmasquerade

+0

@Vinz, non sono sicuro di come ci si sente, ma "Bootstrap" di Twitter è una piattaforma fantastica per iniziare sull'interfaccia per i giorni moderni, e sarebbe meglio se tentassimo di importare le funzionalità da queste piattaforme fortemente ottimizzate. – acpmasquerade

4

Dimensionamento textarea in percentuale si è in qualche modo mai funzionato correttamente, ho avuto lo stesso problema anni fa e finito per usare larghezza: 99% ....

vi suggerisco di utilizzare un div intorno textarea per disegnare la arrotondata frontiera e rimuovere il confine sulla textarea stessa. In questo modo non è necessario che la larghezza della textarea sia esatta, potresti usare il 98% o il 99%.

+1

Oh, bene - controlla il link. Ha funzionato abbastanza bene, ma comunque mi chiedo forse qualcuno sa come fare a fare in modo corretto il dimensionamento dei textareas in percentuale nel mio caso? – Rihards

Problemi correlati