0
如何將按鈕一直浮動到正確的位置？HTML 5按鈕不會對齊文本區域的最右側
我已經嘗試過把它漂浮的權利，並將位置改爲絕對，但我沒有運氣將按鈕推到文本區域的右邊緣。
#counter { float:left; position:relative; margin-left:20px; margin-top:5px;}
.stringsharewrapper { width:100%; height:auto; margin-top:10px; }
.writestring { width:90%; left:20px; height:80px; position:relative; margin-top:10px; }
.stringtitle { color:black; font-family:arial; font-family: Helvetica, Arial, "Sans Serif"; font-size:20px; font-weight:bold; margin-left:20px; margin-top:5px;}
/*----------Filter Button 1 ------------*/
#stringbutton2[type=checkbox]
{
\t border: 0;
\t clip: rect(0 0 0 0);
\t height: 1px;
\t margin: -1px;
\t overflow: hidden;
\t padding: 0;
\t position: absolute;
\t width: 1px;
}
[for="stringbutton2"]
{
\t background: #EEE;
\t background: linear-gradient(top,#FFBF00 0%,#FE9A2E 100%);
\t background: -moz-linear-gradient(top,#FFBF00 0%,#FE9A2E 100%);
\t background: -ms-linear-gradient(top,#FFBF00 0%,#FE9A2E 100%);
\t background: -o-linear-gradient(top,#FFBF00 0%,#FE9A2E 100%);
\t background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#FFBF00),color-stop(100%,#FE9A2E));
\t background: -webkit-linear-gradient(top,#FFBF00 0%,#FE9A2E 100%);
\t border: 1px solid #CCC;
\t border-radius: 5px;
\t box-shadow: inset 0px 0px 1px 0px #FFF;
\t color: #000;
\t filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFBF00',endColorstr='#FE9A2E',GradientType=0);
\t font-family: Helvetica,Arial,"Sans Serif";
\t font-size: 13px;
\t font-weight: bold;
\t left: 5%;
\t moz-border-radius: 5px;
\t moz-box-shadow: inset 0px 0px 1px 0px #FFF;
\t padding: 0;
\t padding: 6px;
\t position: absolute;
\t text-align: center;
\t text-shadow: 1px 1px 1px #DDD;
\t top: 4px;
\t webkit-border-radius: 5px;
\t webkit-box-shadow: inset 0px 0px 1px 0px #FFF;
\t width: 100px;
}
[for="stringbutton2"]:hover
{
\t background: #CCC;
\t background: -moz-linear-gradient(top,#0B2F3A 0%,#100719 100%);
\t background: -ms-linear-gradient(top,#0B2F3A 0%,#100719 100%);
\t background: -o-linear-gradient(top,#0B2F3A 0%,#100719 100%);
\t background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#0B2F3A),color-stop(100%,#100719));
\t background: -webkit-linear-gradient(top,#0B2F3A 0%,#100719 100%);
\t border-color: #BBB;
\t color: #FFFFFF;
\t filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0B2F3A',endColorstr='#100719',GradientType=0);
\t font-weight: bold;
}
[for="stringbutton2"] span.filterswitch:last-of-type
{
\t display: none;
\t visibility: hidden;
}
#stringbutton2[type=checkbox]:checked
{
\t color: #FFA317;
}
#stringbutton2[type=checkbox]:checked~ .filtercontent
{
\t display: block;
\t visibility: visible;
\t width: 100%;
}
#stringbutton2[type=checkbox]:checked~ [for="stringbutton2"] span.filterswitch:first-of-type
{
\t display: none;
\t visibility: hidden;
}
#stringbutton2[type=checkbox]:checked~ [for="stringbutton2"] span.filterswitch:last-of-type
{
\t color: #3CC;
\t display: block;
\t visibility: visible;
}
/*-------------Filter Button Container---------------*/
.submitcontainer
{
\t position: relative;
\t width: 300px; top:0; float:right;
}<div class="sharepagetab sharewrapper activeshare" id="ashare">
<div class="allshares">
<div class="shares">
\t \t \t \t \t
\t \t \t <div class='stringsharewrapper'>
\t \t \t \t \t \t \t \t
<span class="stringtitle">Write Something</span><br />
<textarea class="writestring" onKeyUp="textCounter2(this,'counter',150);"></textarea>
\t \t \t \t <br />
\t \t \t \t
\t \t \t \t <input disabled class="charInput" size="3" value="150" id="counter">
\t \t \t \t
\t \t \t \t <!----------Write button------------>
<div class="submitcontainer">
\t \t \t \t
<input onclick="toggleContent()" type="checkbox" id="stringbutton2" class="cfilterbutton" role="button">
<label for="stringbutton2" onclick="">
<span class="filterswitch">Post</span>
<span class="filterswitch">Post</span>
</label>
</div><!----End Filtercontainer------->
\t \t \t \t
\t \t \t \t
</div>
http://jsfiddle.net/4rsasuh0/出於某種原因，這些按鈕保持正確的，甚至當我添加一個div容器它不包含它。你建議我可以做什麼？ – ChosenJuan 2015-01-27 00:46:45
感謝您的指導，我找到了答案謝謝，我用正確的代碼發佈了上面的答案。 – ChosenJuan 2015-01-27 01:45:03