Objeto no centro da página com css

css, tableless Nenhum comentário »

Vejamos uma solução simples e prática para centralizar objetos em uma página utilizando código css.

Esta solução é muito útil por exemplo para colocar uma imagem em uma página de apresentação ou ainda imagens de “site em breve!”

Como ainda estamos na era da grande guerra de navegadores o código está seguido de um hack para funcionar também no IE 6.

.centered 
  {   

   position: fixed;     

   top: 50%;     

   left: 50%;     

   margin-top: -50px;     

   margin-left: -100px;     

   }     

*html .centered     

  {     

  position:absolute     

  }

teremos como resultado

centered-csstrick.gif

Todas as propriedades CSS ordenadas

css, tableless 6 comentários »

Creio que uma das maiores dificuldades em aprender CSS está em conhecer e memorizar todas os atributos e propriedades. Encontrei hoje uma lista com todas as propriedades CSS em ordem alfabética. Para cara propriedade é mostrado varias características como, valor default, que elementos a possue, sintax, exemplo de utilização, browsers compatíveis, e muito mais.

Acredito que vale muito a pena tê-la em sua lista de favoritos.

Link | propriedades CSS ordenadas

Os poliglotas chamados programadores

ajax, asp, atuais, css, javascript, php, tecnologia, web2.0 5 comentários »

dvd-nerd.gifTente ler o seguinte texto:

“Imaginez il n’ya pas de pays
It isn’t hard to do
Nulla di uccidere o morire per
Und keine Religion zu”

Tarefa difícil?

Eu dei uma globalizada nele :) , as frases estão na seguinte ordem:

Francês
Inglês
Italiano
Alemão

A tradução certamente não é das melhores, foi apenas uma rápida co’piada’ e colada, no tradutor do google.

Motivo?

Sabia que hoje em dia é imprescindível ser um poliglota se você quer ser um programador web?

Exagero? Dê uma rápida olhada nesse simples código:

<input name=”data” type=”text” id=”data” value=”<?=date(“d/m/Y”)?>” onblur=”alert(‘olá mundo!’);” style=”border:1px solid #003399; padding:5px;”/>

Ele não tem funcionalidade nenhuma, é mais uma vez apenas para ilustrar minha idéia. [o bendito tempo que nos falta pra fazer algo realmente decente.]

Pra facilitar a compreensão vamos a uma simples, diferenciação:

<input name=”data” type=”text” id=”data” value=”<?=date(“d/m/Y”)?>” onblur=”alert(‘olá mundo!’);” style=”border:1px solid #003399; padding:5px;“/>

temos assim:

html
php
javascript
css

Isso mesmo, em duas linhas de código temos 4 “linguagens” [html e css não chegam a ser linguagem de programação] diferentes.

Com a evolução da internet e o surgimento de novas metodologias como ajax, por exemplo, isso se torna ainda mais complexo. Podemos ter numa única aplicação representações de html/xhtml/dhtml, css, dom, xml, xslt, javascript, php/asp/aspx/jsp…[mais de uma dessas ao mesmo tempo inclusive]

Se você pretende ganhar a vida como programador pra web e a maioria dessas siglas te parece estranha… prepare-se. Há muito chão pela frente.

Imagine all the people
Living life in peace

:)

Muita felicidade a todos!!!

Gostou? rec6 nele!!!


Copyright © 2007 - 2010 Marquinh05.com .
Rec6plug