HTML Básico

10 respostas
A

Pessoal,

estou com um problema nos radiobuttons desse trecho, que gera a imagem anexa.

<div class="rvgFind">
      <fieldset class="rvgFieldSet">
      <legend>
        <h:outputText value="#{msg.Funcionariosimac} #{msg.SearchCriteria}" />
      </legend> 
      <span class="rvgInputs">
        <h:outputLabel  value="#{msg.Funcionariosimac_matricula}" for="matricula">
          <h:inputText value="#{funcionariosimacFinder.example.matricula}" id="matricula" />
        </h:outputLabel> 
          <h:selectOneRadio value="#{funcionariosimacFinder.optIndicadorAtivo}" id="indicadorAtivo" layout="pageDirection">
            <f:selectItem itemValue="ativos" itemLabel="Ativos" />
            <f:selectItem itemValue="inativos" itemLabel="Inativos" />
            <f:selectItem itemValue="ambos" itemLabel="Ambos" />
          </h:selectOneRadio> 
          <h:selectOneRadio value="#{funcionariosimacFinder.optIndicadorTrocarSenha}" id="indicadorTrocarSenha" layout="pageDirection">
            <f:selectItem itemValue="trocar" itemLabel="Trocar" />
            <f:selectItem itemValue="não trocar" itemLabel="Não Trocar" />
            <f:selectItem itemValue="ambos" itemLabel="Ambos" />
          </h:selectOneRadio> 
        <h:outputLabel value="#{msg.Funcionariosimac_perfil}" for="perfil">
          <h:inputText value="#{funcionariosimacFinder.example.perfil}" id="perfil" />
        </h:outputLabel> 
        <h:outputLabel value="#{msg.Funcionariosimac_senha}" for="senha">
          <h:inputText value="#{funcionariosimacFinder.example.senha}" id="senha" />
        </h:outputLabel> 
        <h:outputLabel value="#{msg.Funcionariosimac_usuario}" for="usuario">
          <h:inputText value="#{funcionariosimacFinder.example.usuario}" id="usuario" />
        </h:outputLabel> <h:outputLabel value="#{msg.PageSize}" for="pageSize">
          <h:inputText value="#{funcionariosimacFinder.pageSize}" id="pageSize" />
        </h:outputLabel>
      </span> 
      <span class="rvgActions"> 
        <h:commandButton type="submit" value="#{msg.Clear}" action="#{funcionariosimacFinder.clear}" /> 
        <h:commandButton type="submit" value="#{msg.Find}"  action="#{funcionariosimacFinder.findFirstPage}" /> 
      </span>
      </fieldset>
    </div>

Gostaria que os botões ficassem embaixo da matrícula. Alguém sabe o que acontece? Pq a segunda sequência fica correta?

Grato.


10 Respostas

eric_jf

vc está usando algum CSS??

A

Sim. Esse:

body { font-family: Arial, Helvetica, sans-serif; font-size: small; }
h2, h3, h4, h5 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; line-height: 1em; }
h1 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; line-height: 1em; color: #ffffff; background-color: #004e98; margin-bottom: 4px; margin-top: 4px; }
.rvgInputs input { display: block; width: 15em; }
.rvgInputs select { display: block; width: 15em; }
.rvgInputs label { clear: both; float: left; display: block; margin: 4px 0; white-space: nowrap; }
.rvgActions { display: block; clear: both; white-space: nowrap; padding-top: 10px; float: left; text-align: right; width: 15em; }
.rvgMessages { padding: 6px; background-color: #ffd; border: 1px solid #999; margin: 10px 0; display: block; list-style: none; }
.rvgMessage { color: red; }
.rvgResults thead, .rvgResultsNone { font-family:  "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold; font-size: 1.2em; }
.rvgResults { margin-left: 18em; padding-bottom: 40px; }
.rvgResults table { width: 99%; border-collapse: collapse; }
.rvgResults thead th { border-bottom: 1px solid #ccc; text-align: left; }
.rvgRowOne { background-color: #f5f5f5; }
.rvgFind { float: left; width: 15em; }
.rvgFind fieldset { float: left; width: 15em; }
.rvgPage { float: left; display: block; padding-top: 10px; border-top: 1px solid #ccc>; }
.rvgOrder a { text-decoration: none; }
.rvgOrder a:hover { text-decoration: underline; color: red; }
.rvgSwitch { display: block; margin-bottom: 15px; background-color: #e0e0e0; width: 100%; text-align: right; margin-top: 0; }
eric_jf

Vc está usando jsf não é?!
não consegui indentificar qual tag do jsf é o botão, não conheço jsf.
Mas faz o seguinte verifique qual a tag relativa e veja o nome da class, e vai mudando no css a localização.

A

Vc não ia conseguir mesmo…

Colei o código da página errada, mas já corrigi lá no primeiro post.

Foi mal… :oops:

eric_jf

Tenta mexer nessa linha do css na parte de largura e altura ve se os botões mexem de lugar:

.rvgActions { display: block; clear: both; white-space: nowrap; padding-top: 10px; float: left; text-align: right; width: 15em; }

Ps.: Bem que eu tava achando estranho…

B

dê uma olhada no seguinte trecho de código css:

.rvgInputs input { display: block; width: 15em; }

você está aplicando um estilo ao input, então serão estilizados todos objetos do tipo input (text,button,radio,checkbox…).

t+

A

Tenho a impressão que não é um problema de estilo, mas que falta uma quebra de linha entre os dois componentes. Como eu faço isso? :frowning:

B

Taz:

Tenho a impressão que não é um problema de estilo mas que falta uma quebra de linha entre os dois componentes. Como eu faço isso? :frowning:

Mas isso também é estilo! Ou seja, a forma como é disposto um determinado componente html também pode ser definido no CSS.

desconfio que seja o display: block; da linha que citei anteriormente.

Sugiro que você remova a linha citada anteriormente, para avaliar o comportamente da página sem ela. Mas tem que testar…

t+

A

Tentei remover e piorou, ele desalinhou todos os labels e input fields. O Radio continua lá, inabalável. Pelo menos entendi para que serve o display:block :roll:

A

Aff, vida de web designer não é fácil… vou dar mais valor quando topar com um por aí … hehehe

A linha que faltava era …

.rvgInputs table { float: left; }

Ele coloca os radiobuttons num table e eu não havia estilo definido para tables.

Valeu pela ajuda.

Abraço.

Criado 14 de setembro de 2006
Ultima resposta 14 de set. de 2006
Respostas 10
Participantes 3