textarea的容器

請檢查下面的小提琴外gettong：textarea的容器

<textarea rows="5" cols="50" style="width:95%;height:90%;overflow:hidden"> 
What's on your mind? 
</textarea>

這裏的時候，我試圖擴大textarea的垂直那盒越來越條條框框。我想要實現它，以便每當用戶垂直擴展textarea時，div背景也應該隨它一起展開。任何人都可以請提供一個解決方案

來源

2016-02-07 Deva

使用此

#container { 
background-color: #e6e6e6; 
border-style: double; 
float: left; 
height: auto; 
min-height: 160px; 
padding-top: 5px; 
width: 470px; 
}

來源

2016-02-07 11:05:50

其導致texarea佔據整版..not期望的結果隊友:( – Deva

它的工作。非常感謝:) – Deva

您可以將此響應標記爲問題的答案，以便其他人看到解決方案。 :)同樣適用於您的其他問題;） –

也許這樣的事情？ https://jsfiddle.net/aa0mkvfz/：

#container { 
    border-style: double; 
    width: 470px; 
    height: 160px; 
    background-color: #E6E6E6; 
    padding-top: 5px; 
    overflow: auto; 
} 
hr { 
    border-color: #FAFAFA; 
    padding: 0; 
    margin: 0 
} 
#upper_space { 
    color: #3b5998; 
    margin: 0; 
    padding-top: 6px; 
    padding-bottom: 5px; 
    padding-left: 10px; 
} 
#textbox { 
    background-color: white; 
    text-align: center; 
    padding-top: 5px; 
    padding-bottom: 5px; 
    overflow: auto; 
} 
#post_part { 
    display: inline; 
    padding: 6px 9px; 
    float: right; 
    font-size: 15px 
} 
select { 
    width: 80px; 
    height: 21px; 
    padding-right: 10px; 
    display: inline 
} 
#button1 { 
    display: inline; 
    padding-left: 10px 
} 
#post_button { 
    height: 24px; 
    width: 70px; 
    font-size: 14px; 
    -webkit-appearance: none; 
}

我所做的只是添加所要求的div的overflow:auto;，這將創建一個新的塊格式化內容，請檢查該文件以瞭解更多有關它： http://www.sitepoint.com/understanding-block-formatting-contexts-in-css/

來源

2016-02-07 11:13:04 angel9215

不合作夥伴。我需要一個Facebook類型的郵箱。這是不期望的 – Deva

我終於明白你想要什麼，它可以用'overflow：auto'完成這是你需要的CSS #container border-style：double; width：470px; min-height：160px; background - 顏色：＃E6E6E6;填充頂：5px的;溢出：汽車;}' – angel9215

HTML

<div class="divv"> 
     <textarea rows="4" cols="65"></textarea> 
     <h4> 
     space 
     </h4> 
</div>

CSS

.divv{ 
    background-color:green; 
} 
textarea { 
    resize: vertical; 
    overflow: auto; 
}

JSFIddle 看看是否有幫助

謝謝

來源

2016-02-07 14:35:42

回答

相關問題