html - 在屏幕上移动输入控制位置

我有以下代码：

.clickBut {
    left: 10px;            /*<<<NO IMPACT*/
    font-family: verdana;
    font-size: 9px;
    font-weight: bold;
    background-color: #ffa500 !important;
    border-radius: 100px;
}

.clickRadio {
    left: 200px;         /*<<<NO IMPACT*/
    font-family: verdana;
    left: 200px;
}
</style>
</head>
<input id="clickMe" type="button" value="Refresh|Reset" onclick="resetRefresh();" class="clickBut" />
<label>
    <input type="radio" name="mode" value="size" class="clickRadio" checked> Size</label>
<label>
    <input type="radio" name="mode" value="count" class="clickRadio"> Count</label>

我只是想知道如何将这些控件放置在屏幕的左上角之外。我尝试在两个类的Left中使用css，但这没有效果。

最佳答案

一种方法是将它们包装在div中并使用text-align属性

在右边显示它们：

<div style="text-align:right">
    <input id="clickMe" type="button" value="Refresh|Reset" onclick="resetRefresh();" class="clickBut" />
    <label>
         <input type="radio" name="mode" value="size" class="clickRadio" checked>
         Size
    </label>
    <label>
        <input type="radio" name="mode" value="count" class="clickRadio">
        Count
    </label>
</div>

在左侧显示它们：

<div style="text-align:left">
        <input id="clickMe" type="button" value="Refresh|Reset" onclick="resetRefresh();" class="clickBut" />
        <label>
             <input type="radio" name="mode" value="size" class="clickRadio" checked>
             Size
        </label>
        <label>
            <input type="radio" name="mode" value="count" class="clickRadio">
            Count
        </label>
    </div>