Criar Web, manuais e recursos para desenvolvimento web

Manuais

Programas

FAQS

Diretório

Comunidade

Inicio > FAQ


	SEÇÕES

Monotemáticos

+ HTML

+ CSS

+ PHP

+ ASP

+ Javascript

Manuais

+ Desde 0

+ Tecnologia

+ Divulgação de sites

+ Flash

Outras Seções

+ Faqs

Serviços e comunidade

+ Boletim

+ Enquete

Parceiros
- CSS para Web Design
- S.O.S Designers
- Slackware-Brasil
- Crie seu Web site
- Oficina da Net

Elementos de listas LI na mesma linha

Quero fazer uma coisa especial com listas.

Poderia conseguir que os deslocamentos entre os elementos das listas sejam dentro da mesma linha, ou seja, que não se faça a quebra de linha entre elementos LI?

A FAQ Elementos de listas LI na mesma linha tem Uma resposta
um comentário sem rever
Pertence à categoria:

CSS

Resposta de Miguel Angel Alvarez

16/5/07

Simplesmente há que definir o estilo float:left; no elemento da lista, assim:

<li style="float:left;">Elemento</li>

Embora logo, para que a lista fique bem possivelmente você necessitará definir outros atributos CSS.

<ul>

<li style="float:left; width:120px; padding-left: 10px;">Elemento 1</li>

<li style="float:left; width:120px; padding-left: 10px;">Elemento 2</li>

<li style="float:left; width:120px; padding-left: 10px;">Outra coisa</li>

<li style="float:left; width:120px; padding-left: 10px;">Esta lista li é de vários elementos por linha</li>

<li style="float:left; width:120px; padding-left: 10px;">Mais</li>

<li style="float:left; width:120px; padding-left: 10px;">Seja o que for</li>

</ul>

Temos vários artigos com exemplos de atributos CSS que se podem aplicar à listas para gerar diversos tipos de listas úteis. Explore nosso Worshop de CSS para encontra-los.


FAQ relacionadas
+ Links que mudam ao passar o mouse
+ Diferenças de colocar estilos CSS em diferentes lugares
+ Mudar tipografia para toda a página
+ Mudar o tamanho de letra de um menu select
+ Estilo nos campos de formulário
+ Estilos em barras de deslocamento
+ Como eliminar as margens de cima e debaixo que tem um formulário
+ Definir as margens de um cabeçalho ou título <h1>
+ Alinhamento de texto à direita
+ Mudar o estilo da primeira letra de um parágrafo
+ Centralizar conteúdo da página
+ Links visitados
+ Cor de fonte em uma tabela
+ Aplicar estilo à primeira linha de um texto
+ Caixa com CSS
+ Construir um boletim com CSS
+ Clip em um div
+ Textarea sem borda
+ Menu dinâmico com CSS
+ Diferença entre atributos CSS margin e padding
+ Altura de camada que seja a da janela do navegador (CSS height: 100%)
+ Construir por tabelas ou camadas
+ Como posso mudar a cor da barra de deslocamento?
+ Mudar a cor dos links
+ Menu com CSS
+ Cursor com imagem
+ Como posso mudar a cor das células quando passo o ponteiro por cima delas?
+ Camadas com CSS
+ Estilo em tabelas HTML com CSS
+ Ocultar camadas com Css
+ CSS dinâmico com ASP

Complementar a resposta
Voltar à árvore de categorias

Sobre nós | Copyright | Anuncie | Entrar em contato

Hospedado por Hostnet Hospedagem de Sites