Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

David Borges

TopMargin css x Firefox

Por , em Desenvolvimento frontend

Recommended Posts

David Borges    0

David Borges
Postado

Pessoal... to estudando sobre css... mas to com um probleminha...

no IE funciona legal mas no Firefox num ta dando...

tipo... o topmargin num ta zerando nem a pau.

já tentei o padding: 0 mas tb num rolô!

 

o código que peguei como exemplo é o do "Layout fixo em 3 colunas"....

 

alguém aí tem a solução??

 

ó meu código..

 

site.asp

CODE

<?xml version="1.0" encoding="iso-8859-1"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link href="style.css" rel="stylesheet" type="text/css" />

<title>Título do Site</title>

</head>

<body>

 

<div id="conteudo_centralizado">

<div id="tudo">

<div id="topo">

<h1>Título</h1>

</div>

<div id="menu">

<ul>

<li><a href="#">Link 1</a></li>

<li><a href="#">Link 2</a></li>

<li><a href="#">Link 3</a></li>

<li><a href="#">Link 4</a></li>

<li><a href="#">Link 5</a></li>

<li><a href="#">Link 6</a></li>

<li><a href="#">Link 7</a></li>

</ul>

</div>

<div id="conteudo">

<h2>Título (1)</h2>

<p>In nibh odio, porttitor vel, mattis vel, porttitor eget, orci. Duis consectetuer

tempus enim. Sed ut felis et tortor feugiat malesuada. Nam vulputate, tellus

eu nonummy dapibus, pede risus luctus dolor, ut nonummy urna felis a lacus.

Nam in dolor tincidunt ante vehicula dignissim. Nulla id libero ut dui placerat

semper. Nulla sit amet nibh at velit facilisis gravida. Phasellus in diam.

Pellentesque volutpat scelerisque dolor. Donec venenatis nulla suscipit

nisl dignissim tristique. Ut ut lorem sit amet purus ullamcorper mattis.

Phasellus ornare ligula non orci. Pellentesque luctus tristique orci. Proin

a est. Nulla porta lacus ut leo. Nulla faucibus pede sit amet dui. Nullam

aliquet lorem at nunc. Nullam eu tellus.</p>

<h2>Título (2)</h2>

<p>Sed tempus turpis vel quam molestie pulvinar. Suspendisse venenatis dolor

semper ipsum. Quisque tempus erat ac mi. Aliquam semper, est nec hendrerit

dignissim, ligula turpis sagittis purus, ut viverra velit eros at augue.

Pellentesque mi nisi, porta eget, pharetra ac, sollicitudin sit amet, nisi.

In sapien ligula lorem sollicitudin facilisis, sodales eget, tempus in,

mauris. Cras risus sem, adipiscing non, convallis ac, consectetuer eu, dolor.

In quam lorem ipsum dolor sit amet. Curabitur tempus aliquam nulla. Etiam

eros.</p>

</div>

<div id="noticias">

<h3>Notícias:</h3>

<ul>

<li><a href="#">Sed accumsan congue</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Nunc ante elit nulla</a></li>

<li><a href="#">Aliquam suscipit consequat</a></li>

<li><a href="#">Cursus sed arcu sed</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Sed accumsan congue</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Nunc ante elit nulla</a></li>

<li><a href="#">Aliquam suscipit consequat</a></li>

<li><a href="#">Cursus sed arcu sed</a></li>

<li><a href="#">Sed accumsan congue</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Nunc ante elit nulla</a></li>

<li><a href="#">Aliquam suscipit consequat</a></li>

<li><a href="#">Cursus sed arcu sed</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Sed accumsan congue</a></li>

<li><a href="#">Nulla dignissim nec augue</a></li>

<li><a href="#">Nunc ante elit nulla</a></li>

<li><a href="#">Aliquam suscipit consequat</a></li>

<li><a href="#">Cursus sed arcu sed</a></li>

</ul>

</div>

<div id="rodape">

<p>® Todos os direitos reservados | <a href="#">Web Designer</a></p>

</div>

</div>

</div>

</body>

</html>

sytle.css

CODE
body {

margin-left: 0px;

margin-top: 0px;

margin-right: 0px;

margin-bottom: 0px;

padding: 0;

font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif;

 

 

}

 

#conteudo_centralizado

{

position: relative;

left: 50%;

width: 740px;

margin: 0 0 0 -370px;

padding: 0;

 

}

 

 

#tudo {

width: 700px;

 

}

 

#topo {

width: 700px;

height: 100px;

background-color: #ff0;

 

 

}

 

#menu {

float: left;

width: 130px;

padding: 10px;

background-color: #cfc;

}

 

#conteudo {

float: left;

width: 370px;

padding: 15px;

 

}

 

#noticias {

float: right;

width: 130px;

padding: 10px;

background-color: #ccc;

}

 

#rodape {

width: 680px;

height: 30px;

padding: 0 10px;

background-color: #ccf;

clear: both;

}

 

#rodape p {

line-height: 28px;

}

brigadão!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

Já tentou CSS Reset? Não? Coloque isso como primeira linha do seu CSS:

 

* {
margin:0;
padding:0;
}

Aliás, SEMPRE comece seu CSS com o CSS Reset, muitos problemas se resolvem com isso :D

 

[]'s

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito