Question

我试图制作它，这样我就可以拥有一个页面，其左侧对齐文本区域，右侧对齐文本区域。目前我只能使用一个左对齐的工作。到目前为止，这是我的代码。

＆＃13;

 div {
    height: 90px;
    line-height: 90px;
    text-align: left;
    border: 2px dashed #f69c55;
    }

＆＃13;

    <div>
  
    <h1 align = "center"> Chat Room </h1>
    <form>

    Chat <br>
    <textarea rows="20" cols = "100"> </textarea>
    <br> <br>
    <input type="submit" value="Submit Chat">
    </form>

    </div>

＆＃13;

Answer 1

您需要将以下CSS分配给textarea。

display: inline-block;
width: 48.5%; /* allowing for margin, paddings, outlines, etc. */

＆＃13;

<!DOCTYPE html>
<html>

<body>
<style>
div {
height: 90px;
line-height: 90px;
text-align: left;
border: 2px dashed #f69c55;
}
textarea {
   display: inline-block;
   width: 48.5%;
}
</style>

<div>

<h1 align = "center"> Chat Room </h1>
<form>

Chat <br>
<textarea rows="20" cols = "100"> </textarea>
<textarea rows="20" cols = "100"> </textarea>
<br> <br>
<input type="submit" value="Submit Chat">
</form>

</div>

＆＃13;

Answer 2

<style>
..
#tx1{
float: left;
}
#tx2{
float: right;
}
</style>
..
<textarea id="tx1" rows="20" cols = "100"> </textarea>
<textarea id="tx2"rows="20" cols = "100"> </textarea>

缺少第二个文字区域？

HTML：屏幕左侧和右侧有文本区域

2 个答案: