Hey,
Ik ben bezig met mijn layout aan het basen, maar nu zie ik opeens dat er een verschil is tussen mijn PSD en mijn css.
Voorbeeld:
Afbeelding niet beschikbaarDe bron kon niet worden geladen (i55.tinypic.com).Bron openen ↗
Hoe los ik dit op?
Code
Ik ben bezig met mijn layout aan het basen, maar nu zie ik opeens dat er een verschil is tussen mijn PSD en mijn css.
Voorbeeld:
Afbeelding niet beschikbaarDe bron kon niet worden geladen (i55.tinypic.com).Bron openen ↗Hoe los ik dit op?
Code
body { margin: 0; padding: 0; background: url(img/bg-ingame.png) #0c0c0c no-repeat; background-position: top center; font: 11px Tahoma; }
#container { width: 1000px; margin: 0 auto; }
#header { width: 555px; padding-top: 140px; margin: 0 auto; }
#header #logo { width: 555px; height: 121px; background: url(img/header.png); }
#menu { width: 837px; padding-top: 10px; height: 50px; padding-left: 40px; margin: 0 auto; background: url(img/menu.png); }
#menu a { padding-top: 63px; padding-left: 213px; display: block; }
#menu a span { display: none; }
#menu #home { width: 110px; height: 34px; float: left; background: url(img/home.png) no-repeat; }
#menu #informatie { width: 110px; height: 34px; float: left; background: url(img/informatie.png) no-repeat; }
#menu #winkels { width: 110px; height: 34px; float: left; background: url(img/winkels.png) no-repeat; }
#menu #lessen { width: 110px; height: 34px; float: left; background: url(img/lessen.png) no-repeat; }
#menu #forum { width: 110px; height: 34px; float: left; background: url(img/forum.png) no-repeat; }
#menu #updates { width: 110px; height: 34px; float: left; background: url(img/updates.png) no-repeat; }
#menu #contact { width: 110px; height: 32px; float: left; background: url(img/contact2.png) no-repeat; }
#contents { width: 897px; margin: 10px auto; padding-left: 15px; color: #fff; }
#contents #left { width: 180px; float: left; }
#contents #left #content { width: 173px; margin-bottom: 10px; padding-bottom: 10px; background: #000; border: 1px solid #335103; }
#contents #left #content h1 { width: 173px; font-size: 11px; color: #fff; font-weight: bold; padding-top: 5px; padding-left: 5px; height: 19px; margin: 0; padding-bottom: 5px; background: url(img/left-h1.png) no-repeat; }
#contents #left #content ul { margin: 0; padding-left: 5px; list-style-type: none; }
#contents #left #content ul li a { text-decoration: none; color: #fff; }
#contents #mid { width: 510px; float: left; }
#contents #mid #content { width: 497px; padding-bottom: 10px; background: #000; border: 1px solid #335103; }
#contents #mid #content h1 { width: 495px; padding-bottom: 5px; font-size: 11px; color: #fff; font-weight: bold; padding-top: 5px; text-align: center; height: 20px; margin: 0; background: url(img/content-h1.png) no-repeat; }
#contents #mid #content p { padding-left: 10px; }
#contents #right { width: 180px; float: left; }
#contents #right #content { width: 173px; margin-bottom: 10px; padding-bottom: 10px; background: #000; border: 1px solid #335103; }
#contents #right #content h1 { padding-bottom: 5px; width: 173px; font-size: 11px; color: #fff; font-weight: bold; padding-top: 5px; text-align: center; height: 19px; margin: 0; background: url(img/left-h1.png) no-repeat; }
#ads { text-align: center; margin-top: 20px; }
.rood-hier { color: #b21722; text-decoration: none; }
.stem-submit { border: 1px solid #fff; background: #000; margin-top: 20px; color: #fff; text-align: center; }
#footer { width: 308px; height: 37px; background: url(img/footer.png); margin: 0 auto; } 
)