[英]How i can put struts 2 elements horizontally?
我正在使用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>
我希望滑块出现在最后一个按钮(加号按钮)的旁边
如果要内联打印滑块,则需要使用display:inline-block
属性,并给滑块指定一定的宽度。
在您的CSS中:
#echo4 {
display: inline-block;
width: 100px;
}
您可以在此处查看演示。
您可以尝试将表单元素的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>
您可以将滑块的显示属性设置为inline,
<style>
#echo4
{
display:inline;
}
</style>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.