Nieuw lid |
|
Hey,
Ik heb een probleem met het uitlijnen van een img op mijn site.
Ik doe dit dmv css, de img staat wel juist maar men layout wordt wat verknoeid 
heeft er iemand een oplossing?
In IE
In FF
Dit is de html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>PI Solutions :: Beheer</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="robots" content="noindex, nofollow" />
<link href="http://www.pisolutions.be/style2.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="layout">
<div id="header">
<h1>PI Solutions :: Beheer</h1>
</div>
<div id="nav"><a href="index.php">Home</a> | <a href="news.php">News</a> | <a href="portfolio.php">Portfolio</a> | <a href="../index.php">User View</a></div>
<h2>Portfolio</h2>
<p><a href="http://www.pisolutions.be/beheer/portfolio.php?add=1">Add site</a></p>
<img src="http://www.pisolutions.be/img/portfolio/PCfaq.be.jpg" class="floatLeft" /><p><strong><a href="test" target="_blank">PCfaq.be</a></strong><br>
Test</p>
<div id="footer">© 2005 PI Solutions</div>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>PI Solutions :: Beheer</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta name="robots" content="noindex, nofollow" /> <link href="http://www.pisolutions.be/style2.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="layout"> <div id="header"> <h1>PI Solutions :: Beheer</h1> </div> <div id="nav"><a href="index.php">Home</a> | <a href="news.php">News</a> | <a href="portfolio.php">Portfolio</a> | <a href="../index.php">User View</a></div> <h2>Portfolio</h2> <p><a href="http://www.pisolutions.be/beheer/portfolio.php?add=1">Add site</a></p> <img src="http://www.pisolutions.be/img/portfolio/PCfaq.be.jpg" class="floatLeft" /><p><strong><a href="test" target="_blank">PCfaq.be</a></strong><br> Test</p> <div id ="footer">© ; 2005 PI Solutions </div > </div> </body> </html>
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 70%;
color: #000000;
padding: 0px;
margin: 0px;
background-color: #CCCCCC;
text-align: center;
}
#header{
margin: 0px;
padding: 0px;
}
#main{
margin: 0px;
padding: 0px;
}
#layout{
margin: 0px auto;
padding: 0px;
background-color: #FFFFFF;
width: 750px;
border: 1px solid #666666;
text-align: left;
}
h1 {
font-size: 1.5em;
margin: 5px 0px;
padding: 0px 0px 0px 3px;
color: #5F7686;
}
h2 {
font-size: 1.2em;
margin: 5px 0px;
padding: 0px 0px 0px 3px;
color: #19456F;
}
p {
font-size: 1em;
margin: 8px 0px;
padding: 0px 0px 0px 3px;
}
a,a:link {
color:#09c;
font-size:11px;
text-decoration:none;
}
a:hover {
color: #000000;
}
#footer {
text-align: center;
color: #FFFFFF;
border-top: solid 1px #666;
padding: 2px;
font-size: 80%;
background-color: #19456F;
}
#nav {
border-bottom: solid 1px #666;
border-top: solid 1px #666;
padding-left: 5px;
padding-top: 3px;
padding-bottom: 3px;
background-color: #19456F;
color: #FFFFFF;
}
img.floatLeft { float: left;
margin: 4px; }
body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 70%; color: #000000; padding: 0px; margin: 0px; background-color: #CCCCCC; text-align: center; } #header{ margin: 0px; padding: 0px; } #main{ margin: 0px; padding: 0px; } #layout{ margin: 0px auto; padding: 0px; background-color: #FFFFFF; width: 750px; border: 1px solid #666666; text-align: left; } h1 { font-size: 1.5em; margin: 5px 0px; padding: 0px 0px 0px 3px; color: #5F7686; } h2 { font-size: 1.2em; margin: 5px 0px; padding: 0px 0px 0px 3px; color: #19456F; } p { font-size: 1em; margin: 8px 0px; padding: 0px 0px 0px 3px; } color:#09c; font-size:11px; text-decoration:none; } a:hover { color: #000000; } #footer { text-align: center; color: #FFFFFF; border-top: solid 1px #666; padding: 2px; font-size: 80%; background-color: #19456F; } #nav { border-bottom: solid 1px #666; border-top: solid 1px #666; padding-left: 5px; padding-top: 3px; padding-bottom: 3px; background-color: #19456F; color: #FFFFFF; } img.floatLeft { float: left; margin: 4px; }
Alvast bedankt!
|