Background, hoe plaats ik hem goed?
Ruben Portier op 07/05/2011 16:33:37:
Ik ben redelijk goed met CSS, dus een cursus is zeker niet nodig! De reden waarom ik telkens opnieuw een font-family mee geef is omdat ik nog bezig ben aan de layout en ik eerst verschillende lettertypes had. Ik heb dit aangepast en moet dit inderdaad nog gewoon in de body doen. Een padding en margin 0 is niet nodig lijkt me? Ik heb al bij * { margin: 0; padding: 0; } geplaatst en * betekend volgens mij toch alle objecten. Ik weet ook wel dat * niet bij alles werkt enzo, maar body geeft geen margin en/of padding hoor.
Maar hoe kan ik dit nu het beste oplossen? Want ik zou het eigenlijk niet meteen weten.
Bedankt alvast!
Maar hoe kan ik dit nu het beste oplossen? Want ik zou het eigenlijk niet meteen weten.
Bedankt alvast!
Dan zou je ook een background goed kunnen zetten zonder enige problemen, neem ik aan? :P
Ruben Portier op 07/05/2011 16:33:37:
Ik ben redelijk goed met CSS, dus een cursus is zeker niet nodig!
Damn waarom vraag je hier dan hulp, dit zijn de beginselen.. Niet naast je schoenen lopen en gewoon curcussen volgen.
Hier paar dingen wat beter kan:
1) Geen lege divs gebruiken.
2) <p class="title"> wtf slaat dit op, hier zijn h1, h2 tags voor.
3) h1 tags als logo? Kan maar niet op deze manier... h1 moet sleutel woorden bevatten, hij bevat er nu 1 en dat is zonde...
4) <div class="clear"> is ouderwets, gebruik een overflow: hidden; op parent dit of gebruik :after functie.
5) block01, block02. Naamgeving kan beter...
6) Gebruik in je inlog formulier labels ipv divs.
7) Je gebruikt heeeeeeel veel overbodige divs...
8) <ul><span class="clear"></span></ul> is al helemaal fout, zie punt 4.
Zo kan ik nog wel even door gaan... Dus kappen te zeggen dat je redelijk goed bent met CSS....
Zoals ik al zei, een wrapper om de content div maken die zo breed is als het scherm en daar background op zetten....
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
.content-wrapper {
overflow: hidden;
width: 100%;
background: #ccc;
}
.content-wrapper .content {
width: 900px;
margin: 0 auto;
padding: 10px 0;
overflow: hidden;
}
overflow: hidden;
width: 100%;
background: #ccc;
}
.content-wrapper .content {
width: 900px;
margin: 0 auto;
padding: 10px 0;
overflow: hidden;
}
Code (php)
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
<div class="header">
Dit is header shit
</div>
<div class="content-wrapper">
<div class="content">
Hier alle shit plaatsen
</div>
</div>
<div class="footer">
Dit is footer shit
</div>
Dit is header shit
</div>
<div class="content-wrapper">
<div class="content">
Hier alle shit plaatsen
</div>
</div>
<div class="footer">
Dit is footer shit
</div>
Gewijzigd op 07/05/2011 21:07:52 door Joakim Broden