Ik heb een layout gemaakt met photoshop. En die weer in stukken gesliced zodat ik hem kon exporteren naar een .html

Toen heb ik er een stylesheet aan gelinkt. Maar nu, via firefox is er niets aan de hand. Maar wanneer ik de pagina laad in IE komen er overal rare spaties tussen:


de site: http://www.jcspam.nl/test/

Heeft iemand een idee wat ik verkeerd doe?

de .css: <?
/* Web layout */
#site_layout {
padding-top: 30px;
padding-bottom: 30px;
height: 100%;
width: 800px;
}
#wrapper {
width: 800px;
border:1px solid #FFFFFF;
}

/* Web content */
#menu_1 {
background-color: #e9e9e9;
height: 121px;
width: 528px;
padding: 10px;
}

#menu_2 {
background-color: #8db0d8;
height: 216px;
width: 223px;
padding: 5px;
}
#content_1 {
background-color: #f1f2ba;
height: 425px;
width: 105px;
padding-right: 5px;
padding-bottom: 10px;
padding-left: 10px;
}
#content_2 {
background-color: #FFFFFF;
height: 425px;
width: 655px;
padding-right: 15px;
padding-bottom: 10px;
padding-left: 10px;
}
#footer {
background-image: url(../images/footer.jpg);
height: 20px;
width: 800px;
}
#bar_middle {
background-image: url(../images/middlebar.jpg);
height: 30px;
width: 538px;
padding-left: 10px;
}
#tab {
background-image: url(../images/b1.jpg);
height: 29px;
width: 90px;
}
?>
Hey die ga ik ook maar eens lezen. Dus ook bedankt van mij ;-)
bedankt voor de links naar de tuts. Het .css is alweer wat helderder geworden.

De layout was ook daad werkenlijk naar de knoppen omdat het in een tabel was geplaatst . En dat werkt niet goed in IE, zoals je net is gezegd. Bedankt voor de gouden tip.

Maar nu kon ik de hele layout weer opnieuw in richten met de hand via css. Om zo de website uit de tabel te halen. Maar ik kwam er gelukkig op tijd achter dat je dit ook via photoshop kunt doen:

klikt op "save for web and devices"
Dan moet je op het pijltje klikken naast de kolom van "preset"
Daarna op "Edit output settings"
Dan "slices" -> Generate CSS
Dan op OK

En je hebt je index opgemaakt in CSS div's. En werkt je layout ook veel beter in IE.

Reageren