impedisci ai div di prendere il 100% di larghezza

Question

<div style="position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px;"> 

    <div style=" 
     border: 2px solid black; 
     margin: 0 auto; 
     text-align: center; 
     padding: 3px;"> 

    Hello<br />Hola 

    </div> 

    <div style=" 
     border: 2px solid black; 
     margin: 0 auto; 
     text-align: center; 
     padding: 3px;"> 

    Another Sentence 

    </div> 

</div> 

Ho un problema: i confini della portata del div interno su tutta la larghezza della pagina, ma voglio che inquadrino solo il contenuto al loro interno. Se io uso: display: inline i bordi inquadrano ogni linea separatamente e si sovrappongono, quindi non funziona - qualcuno può aiutarti?

P.S lo stile di non vengono dichiarati come questo nel documento originale, ma in un foglio di stile

Answer 1

Assegnare una larghezza all'elemento posizionamento assoluto? Se stai cercando involucri termoretraibili, float:left o display:inline-block sono perfetti per questo.

Answer 2

Prova display:inline-block, mi aiuta sempre in situazioni come questa.

http://jsfiddle.net/FaYLk/

Answer 3

La sua non è così semplice fare solo:

display: inline-block; 

si deve fare di più al browser croce questo.

display: inline-block; 
display: -moz-inline-stack; /* for firefox 2 */ 
*display: inline; /* for ie 6 and 7 */ 

Answer 4

Mettere un contenitore intorno a tutto il contenuto. E.g

<div class='container'> <div>I wont be 100%</div> <div>Nor will I :)</div> </div> 
.container{ display: inline-block; }