IE/FF padding probleem

**Hein Maas** · 12-06-2007, 19:46

Hoi allemaal,

Ik ben mezelf xhtml/css aan het aanleren en het lukt vrij aardig voor de eerste keer.

Nu heb ik het volgende probleem, ik heb het content gedeelte in orde maar als ik er tekst in plaats dan weet ik niet hoe je de tekst een padding moet geven zodat die zowel met ie als met ff goed binnen de content blijft.

Voorbeeld hier

Css voorbeeld hier beneden.

Code:

/* CSS Document */

body {
    background-image: url(images/bg.png);
    background-color:#e6eadc;
    background-repeat: repeat-x;
    margin: 72px 199px;
    font-family:Tahoma, Arial;
    font-size:12px;
    color:#333333;
}

.top {
    background-image:url(images/top.png);
    background-repeat:no-repeat;
    margin: auto;
    width:517px;
    height:64px;
}
.top1 {
    background-image:url(images/top1.png);
    background-repeat:no-repeat; 
    margin: auto;
    width:517px;
    height:116px;
}
.contentbg {
    background-image:url(images/contentbg.png);
    background-repeat:repeat-y;
    width:517px;
    margin: 0px auto;
    height: auto !important;
}
.contentfooter {
    background-image:url(images/contentfooter.png);
    background-repeat:no-repeat;
    margin: auto;
    width:517px;
    height:15px;
}

Xhtml voorbeeld hier

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>blog..</title>
<link rel="stylesheet" href="style.css" type="text/css" />
</head>
<body>
<div class="top"></div>
<div class="top1"></div>
<div class="contentbg">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent bibendum porta massa. Nunc condimentum. Sed eros. Curabitur pellentesque elit ut lacus porta elementum. Etiam vel lectus non ante feugiat tempus. Morbi eget nisi. Ut id augue non sapien suscipit ornare. Nullam viverra ligula. Fusce mauris diam, pharetra et, sodales id, interdum a, arcu. Vivamus venenatis tempor velit. Morbi vel lectus.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent bibendum porta massa. Nunc condimentum. Sed eros. Curabitur pellentesque elit ut lacus porta elementum. Etiam vel lectus non ante feugiat tempus. Morbi eget nisi. Ut id augue non sapien suscipit ornare. Nullam viverra ligula. Fusce mauris diam, pharetra et, sodales id, interdum a, arcu. Vivamus venenatis tempor velit. Morbi vel lectus.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent bibendum porta massa. Nunc condimentum. Sed eros. Curabitur pellentesque elit ut lacus porta elementum. Etiam vel lectus non ante feugiat tempus. Morbi eget nisi. Ut id augue non sapien suscipit ornare. Nullam viverra ligula. Fusce mauris diam, pharetra et, sodales id, interdum a, arcu. Vivamus venenatis tempor velit. Morbi vel lectus.Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent bibendum porta massa. Nunc condimentum. Sed eros. Curabitur pellentesque elit ut lacus porta elementum. Etiam vel lectus non ante feugiat tempus. Morbi eget nisi. Ut id augue non sapien suscipit ornare. Nullam viverra ligula. Fusce mauris diam, pharetra et, sodales id, interdum a, arcu. Vivamus venenatis tempor velit. Morbi vel lectus.</div>
<div class="contentfooter"></div>
</body>
</html>

En vergeet niet dat dit mijn eerste Xhtml/css coding klusje is voor mezelf en dan ook nog eens zonder tabellen :D, dus wees niet te streng

Met Vriendelijke Groet, Hein Maas

**Hein Maas** · 12-06-2007, 21:54

Probleem opgelost, ik heb de tekst tussen <p></p> gezet en een css lijn toegevoegd.

Code:

.content p {
    margin: 0px 25px 0 25px;
}

En dat deed het hem, :D, bevalt me wel dat knutselen.

**David C.** · 12-06-2007, 22:02

Makkelijker nog:

.content p { margin: 0 25px; }

IE/FF padding probleem