Question

我正在使用Struts 2 + JqueryUI Struts2插件，我希望将一些项目水平放在一起。

在struts2表单项中，所有元素都是垂直的......

这是我的代码：

<s:form action="test" theme="simple">
<sj:a id="ajaxlink" onclick="disminuyeBloque()" button="true" buttonIcon="ui-icon-minus" cssStyle="height:20px"/>
<sj:textfield id="tamannobloque"  name="tamannobloque" readonly="true" size="2" />
<sj:a id="ajaxlinkminus" onclick="aumentaBloque()" button="true" buttonIcon="ui-icon-plus" cssStyle="height:20px"/>
<sj:slider id="echo4" name="slider" label="Echo" value="{3, 7}" min="1" max="10" onCompleteTopics="sliderRangeStop" cssStyle="margin: 10px; width:20%"/>
</s:form>

我希望滑块出现在最后一个按钮（加号按钮）

旁边

Answer 1

如果要内联打印滑块，则需要使用display:inline-block属性并为滑块指定一定的宽度。

在你的CSS中：

#echo4 {
    display: inline-block;
    width: 100px;
}

您可以看到演示here。

Answer 2

您可以尝试将表单元素的parentTheme设置为css_xhtml，并使用div将元素包装在同一行，然后应用您的样式。

类似

<s:form action="test" theme="simple">
<div>
<sj:a id="ajaxlink" onclick="disminuyeBloque()" button="true" buttonIcon="ui-icon-minus" cssStyle="height:20px"/>
<sj:textfield id="tamannobloque"  name="tamannobloque" readonly="true" size="2" parentTheme="css_xhtml"/>
</div>
<div>
<sj:a id="ajaxlinkminus" onclick="aumentaBloque()" button="true" buttonIcon="ui-icon-plus" cssStyle="height:20px"/>
<sj:slider id="echo4" name="slider" label="Echo" value="{3, 7}" min="1" max="10" onCompleteTopics="sliderRangeStop" cssStyle="margin: 10px; width:20%" parentTheme="css_xhtml"/>
</div>
</s:form>

Answer 3

您可以将滑块的显示属性设置为内联，

<style>
#echo4    
{
display:inline;
}
</style>

如何将struts 2元素水平放置？

3 个答案: