Arquivo da categoria ‘CSS’

Layout de 3 Colunas – No joomla

Este é o terceiro da série e que irá mostrar como fica no joomla. Se perdeu os dois primeiros, clique aqui para ler o primeiro post e clique aqui para ler o segundo.
Como vamos resolver o problema de ter ou não o lado direito do nosso template ou não?
MERDA, O CODIGO NAO FICA LEGAL. [...]

Continuar lendo »

Layout de 3 Colunas – Aprofundando no css

Este é o segundo da série.
Se perdeu o primeiro, clique aqui antes de continuar…
No artigo anterior tivemos um layout de 3 colunas básico.

Continuar lendo »

Layout de 3 colunas para Joomla – Introdução

Estudo avançado sobre como criar um template de 3 colunas para Joomla 1.5
A quem se destina: Desenvolvedores de template
Nível: Médio a Avançado
Requer: Conhecimento de HTML, CSS e Joomla

Continuar lendo »

overflow: auto e position: absolute: Bug no IE

Isso é só pra deixar registrado. Se você fizer um div (com overflow: auto) onde irão aparecer os textos e depois dentro tiver um elemento com position: absolute, isso vai fuder tudo sua vida no Internet Explorer.
Inclusive esse bug é usado pra simular o position: fixed para o IE!
Vai entender!

Continuar lendo »

Zerar Estilo

Por falha – minha opinião – o default de cada elemento html tem certas propriedades que necessitam serem zeradas ou padronizadas para que você tenha melhor controle do modo de apresentação de sua página. Para template do joomla, eu uso o seguinte código antes de tudo:

Continuar lendo »

Área de Download

Recentemente peguei um projeto que a minha chefa pediu uma área de downloads que fosse algo simples, prático e intuitivo.

Continuar lendo »

Borda nas fotos

Quem viu que mudei o layout do meu blog deve ter percebido que todas as fotos do conteúdo tem uma borda branca e sombra. Como é feito isso? Fui verificar o css e ver como é feito e eis aqui o segredo.
Tem uma imagem de 800X800 com a borda direita e embaixo pintados. [...]

Continuar lendo »

Contentheading 100% – Template para Joomla

Descrição: Ao setar na Configuração Global do Joomla para não mostrar os icones de pdf, impressora e enviar a um amigo, já percebeu que o heading de um conteúdo estático irá ficar somente limitado ao tamanho do texto escrito.
Veja o exemplo abaixo:

Para se ter esse efeito usei a seguinte definição de css:
.contentheading {
font-size:15px;
font-weight:bold;
text-transform:uppercase;
border-bottom: 1px [...]

Continuar lendo »

Como depurar um código css

Descrição: O básico do básico de css pra poder fazer achar onde está os erros
Linguagem: CSS
Hoje a dica é curta e grossa. Quem se aventurou a criar um layout do zero ja deve ter arrancado os cabelos pra tentar entender como um div esta se comportando. Vira e mexe, quebra o layout.
Como fazer então, já [...]

Continuar lendo »

Duas classes no mesmo elemento!

Explicação: Um elemento pode ter mais de uma classe, bastando deixando um espaço entre as classes.
Linguagem: CSS
Código:
<div id=”bloco”>
<ul>
<li class=”item”>item 1</li>
<li class=”item azul”>item 2</li>
<li class=”item”>item 3</li>
<li class=”item azul”>item 4</li>
</ul>
</div>
Exemplo:
- Lista com cores alternadas
Mais:
Pinceladas da Web

Continuar lendo »