Maakt ook niets uit, de tekst blijft lager dan dat plaatje :S
Stop het allebei in een <span> en geef de ene een float: left; mee en de andere een float: right;
Misschien nog gebruik maken van text-align.
Je kan het plaatje dan wel omlaag krijgen denk ik, geef het plaatje eens als id "footerimg" en zet dan onderstaande in je css:
img #footerimg{
margin-top:2px;
}
beetje met de margin-top spelen (1px, 3px enz.) en je moet hem goed kunnen krijgen.
Volgens mij zo:
#copyleft {
float: left;
}
Groet, Barry
float: left staat hij al, de pic beweegt niet en de tekst ook niet. (bij allemaal geprobeerd :S)
Img, oeps, te vlug weggestuurd...
Chris,
Heb je hier wat aan?
CSS:
#footer {
width: 750px;
height: 40px;
border: solid 3px;
border-color: #FF0000;
background-color: #2D65FF;
}
#color {
height: 10px;
background-color: #FFFFFF
}
#copyleft{
width: 415px;
height: 20px;
border: solid 0px; border-color: #FFCC00;
padding-top: 20px;
padding-left:35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
}
#copymiddle {
position: relative;
top: -43px;
left: 450px;
width: 100px;
height: 20px;
border: solid 0px; border-color: #000000;
padding-top: 22px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
}
#copyright {
position: relative;
top: -86px;
left: 550px;
width: 100px;
height: 20px;
border: solid 0px; border-color: #33CC00;
padding-top: 23px;
padding-left:35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
}
a:link {
padding-left: 35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
text-decoration: underline;
}
a:visited {
padding-left: 35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
text-decoration: underline;
}
a:active{
padding-left: 35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
text-decoration: underline;
}
a:hover {
padding-left: 35px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFFFFF;
font-weight:normal;
text-decoration: underline;
}
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://
www.w3.org/TR/html4/loose.dtd">;
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>PHP forum</title>
<link href="chris.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="footer">
<div id="color">
<div id="copyleft">© 2007<a href="http://hosting.scriptersdomein.nl/">Zeeuwse-Hosting</a></div>
<div id="copymiddle"><a href="">Disclaimer</a></div>
<div id="copyright"><img src="php.png" width="80" height="15" alt="PHP-Powered"></div>
</div>
</div>
</body>
</html>
Werkt goed in IE. FF en Opera. Bij vergroten van het beeld geeft IE problemen. Is het daarom niet handiger zo'n footer in Phtoshop te maken?
