Question

我是CSS的新手 - 和js / jquery / asp.net等，目前处于一个很大的学习曲线上！ :) - 我有以下样式，但由于某种原因，它没有在文本框上工作 - 我错过了一些非常简单的东西吗？

.label-wrapper
{
    position: relative;
    min-width: 100px;
    max-width: 600px;
    height: 24px;
    display:block;
    margin-left: 10px;

}

.label-wrapper > label
{
    position: absolute;
    left: 0;
    width: 85px;
    height: 50px;
}

.label-wrapper > span
{
    position: absolute;
    left: 0;
    width: 190px;
    height: 50px;
}

.label-wrapper > button
{
    position: absolute;
    left: 170px;
    width: 300px;
}

.label-wrapper > textarea
{
    position: absolute;
    left: 170px;
}

.label-wrapper > input[Type=Text]
{
    position: absolute;
    left: 170px;
    width: 250px;

}
.label-wrapper > input[id=txtDateReceived]
{
    position: absolute;
    left: 170px;
    width: 100px;

}    

.label-wrapper > input[id=txtDateReceivedTime]
{
    position: absolute;
    left: 280px;
    width: 70px;   
}
.label-wrapper > select
{
    position: absolute;
    left: 170px;
    width: 300px;
    height: 24px;
}

请参阅此处的jsfiddle＆gt; http://jsfiddle.net/eoykms9o/

我希望Click Me按钮出现在Notes区域下，最好是 jobDetails div

提前致谢

Answer 1

您只需要添加Notes:父div，<div class"label-wrapper teaxtarea-wrapper">，而不是在css文件下面添加css：

.teaxtarea-wrapper{height: 76px;}

完成...

Answer 2

最简单的解决方案是在以下位置再添加两个<br />标记：

        <textarea id="txtNotes" rows="5" cols="50"></textarea>
        </div>
        <br />
        <br />
        <br />
        <br />
                    <div class='label-wrapper'>
            <button id="TestButton2" type="button">
                Click me</button>
            <br />
            <br />
        </div>

但遗憾的是，整个页面使用了非常糟糕的开发技术。

我知道你只是在学习，但这并不是你应该建立页面的方式。

对所有东西使用绝对定位意味着它像留言板上的笔记一样粘在墙上。你应该认为你的页面更像是另一个项目下面的一个项目流程。

查看Bootstrap这个事情的一个很好的起点。

Answer 3

你应该替换.label-wrapper＆gt;来自你的CSS的按钮并使用它。

  .label-wrapper > button {
  left: 190px;
  width: 300px;
  margin-top: 20px;
  margin-left: 100px;
  }

Answer 4

试试这个

textarea{
/*style */
 }
 #txtNotes{
   /*style */
}

Fiddle

Answer 5

再添加两个<br/>

http://jsfiddle.net/eoykms9o/5/

Answer 6

我希望Click Me按钮显示在Notes区域下，最好是在jobDetails div
之外

这是因position: absolute textarea div.label-wrapper所致，因此父div.label-wrapper无法自动正确设置身高。要解决此问题，您可以明确设置此absolute的高度。

或者不要使用{{1}}定位。我没有看到你使用绝对定位的原因。

CSS不在textarea上工作

6 个答案: