代码之家 › 专栏 › 技术社区 › John Bernal

HTML显示字段集和按钮内联

fieldset inline css-float input html

John Bernal · 技术社区 · 12 年前

我有一个带有文本输入框和提交按钮的字段集。我希望它们出现在单行中,但字段集出现在一行中,然后continue出现在下一行中。这是我的html:

<label><fieldset class="registration_code">
    <legend>Registration Code</legend>
    <input type="text" name="regis_code" id="regis_code"/>
</fieldset>
    <input type="button" class="button2" name="Submit" value="Continue"/>
</label>

我已经尝试了使按钮或字段集内联、内联块、float:left和float:right的所有组合。他们都没有得到我想要的。我只想要一行显示这两个元素。我该怎么做?

2 回复 | 直到 12 年前

Lowkase 12 年前

不确定为什么将代码包装在标签标签中:

http://jsfiddle.net/hyxaK/1/

<fieldset class="registration_code">
    <legend>Registration Code</legend>
    <input type="text" name="regis_code" id="regis_code"/>
</fieldset>
<input type="button" class="button2" name="Submit" value="Continue"/>

.registration_code { display:inline-block; }

-1

code-jaff 12 年前

要么你可以这样做,

<label>
    <fieldset class="registration_code">
    <legend>Registration Code</legend>
    <input type="text" name="regis_code" id="regis_code"/>    
    <input type="button" class="button2" name="Submit" value="Continue"/>
    </fieldset>
</label>â

或者这样,

fieldset{
    display : inline-block;
}â

DEMO

推荐文章

H. Saleh · 浮动:左:溢出时项目消失

7 年前

Christine · 菜单项向左和向下浮动

7 年前

MyDaftQuestions · 如何强制HTML元素左对齐而不换行

7 年前

JBH · 如何防止对象缠绕浮动图像?

7 年前

Joe Harvey · Div隐藏在Chrome中

7 年前

Rusletov · 使元素与浮动元素的边界相邻

7 年前

Lion King · 使用“float”时会出现不需要的空格

7 年前

Ashley · CSS浮动设置为右,但左浮动[重复]

8 年前

JDS · 如何使两个图像按钮超链接并排占据全屏?

8 年前

Russel Riehle · 如何基于父项的右边缘打开超出的子菜单区域?

8 年前