css column-count mit divs und textarea

Question

Hier ist die Geige, kann jemand das bekommen, so dass der Textbereich inline mit den anderen Spalten angezeigt werden kann?

https://jsfiddle.net/ckatocnz/

Beispiel der Geige html unter

<div class="row"> 
    <div>1</div> 
    <div>2</div> 
    <div><textarea>3</textarea></div> 
    <div>4</div> 
    <div>5</div> 
</div> 

Answer 1

Sie müssen auf jeden Fall innerhalb .rowdisplay: inline-block; Ihrem Kind divs anzuwenden.

.row div { 
 
    border: 1px solid black; 
 
    display: inline-block; 
 
    width: 100px; 
 
    height: 40px; 
 
    vertical-align: middle; 
 
} 
 

 
.row textarea { 
 
    box-sizing: border-box; 
 
    width: 100%; 
 
    height: 40px; 
 
}

<div class="row"> 
 
    <div>1</div> 
 
    <div>2</div> 
 
    <div><textarea>3</textarea></div> 
 
    <div>4</div> 
 
    <div>5</div> 
 
</div>

Answer 2

Versuchen mit diesem

.row { 
 
\t border-width: 1px 1px 1px 1px; 
 
\t border-spacing: 2px; 
 
\t border-style: outset outset outset outset; 
 
\t border-color: black black black black; 
 
\t border-collapse: collapse; 
 
\t -webkit-column-count: 5; /* Chrome, Safari, Opera */ 
 
    -moz-column-count: 5; /* Firefox */ 
 
    column-count: 5; 
 
} 
 

 
.row textarea { 
 
    height: 16px; 
 
}

<div class="row"> 
 
    <div>1</div> 
 
    <div>2</div> 
 
    <div><textarea>3</textarea></div> 
 
    <div>4</div> 
 
    <div>5</div> 
 
</div>