InputText旁边的Primefaces SelectOneMenu位于不同的垂直位置

Question

InputText旁边的Primefaces SelectOneMenu位于不同的垂直位置

当我将Primefaces SelectOneMenu放在Primefaces Input旁边时,它们在浏览器中的高度不同(在Firefox,IE和Chrome中也是如此):

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head />
    <h:body>
        <p:selectOneMenu>
            <f:selectItem itemLabel="Item1" />
        </p:selectOneMenu>
        <p:inputText value="Text" />
    </h:body>
</html>

Run Code Online (Sandbox Code Playgroud)

是否可以(使用css)将这两个输入彼此相邻放置,以便它们可以在同一垂直位置的一行中显示？

(我使用Primfaces 5.1.)

Answer 1

dim*_*e47 8

尝试使用vertical-align属性.

<h:body>
    <p:selectOneMenu style="vertical-align:middle">
        <f:selectItem itemLabel="Item1" />
    </p:selectOneMenu>
    <p:inputText value="Text" style="vertical-align:middle" />
</h:body>

Run Code Online (Sandbox Code Playgroud)

请注意,不一定要将middle组件放在相同的高度上.检查生成的html for,selectOneMenu并input尝试不同的值vertical-align,并找到最适合您的变体.

归档时间：	11 年，5 月前
查看次数：	4076 次
最近记录：	9 年，10 月前