Onderaan mijn website zou ik graag een grijze balk willen, met een breedte van 100%.
In deze balk moet één regel komen te staan met een copyright teken, de naam van de website en noem maar op.
Ik weet van mezelf dat ik "dwangmatisch" programmeer (een soort smetvrees, maar dan op gebied van programmeren) en nu stoor ik me heel erg aan iets dat ik hiervoor veel heb gebruikt:
In dit laatste geval zou de div, de grijze balk weergeven en de p de inhoud ervan.
Maar nu vraag ik me dus af of dit wel een goede aanpak is?
Ten slotte nog de vraag of er meer mensen zijn die "programmeren met smetvrees", ik stoor me er namelijk heel erg aan en het zit ook behoorlijk in de weg van het leren van nieuwe dingen.
Ik heb toch nog een vraagje over het toevoegen van een stijl aan de header en footer. Als ik het volgende niet "mag" doen:
<header id="header"></header>
Hoe specificeer ik in de css dan dat ik het over de header heb die ik wil aanpassen, en niet over de header van bijvoorbeeld een article? Ik begrijp uit de berichten hierboven dat dit dan moet door middel van een class (article__header, page__header). Waarom mag dat dan wel op die manier?
Ozzie, als je mij een beetje kent zul je wel weten dat ik zelden zorgen maak over performance (voordeel van het niet werken voor klanten :P). In een van mijn allereerste sites waar ik HTML5 elementen ging gebruiken gebruikte ik ook geen classes. Ik stylde gewoon de header en footer. Dat werkte perfect, maar mislukte volkomen toen ik headers in een article in meegeven. Ik moest dan eerst alle stijlen van de header gaan resetten voordat ik de article header een stijl mee gaf. Dit probleem heb ik op gegeven moment met zoveel tags gehad dat ik besloot dat ik het op een andere manier moest aanpassen.
Gelukkig leerde ik toen BEM kennen, dat is de rede dat ik tegenwoordig vaak de BEM methode gebruik. Waarom je dan .article__header gebruikt en niet gewoon .article header? Omdat een aside ook een header krijgt, die willen we niet de stijlen van de article header meegeven. Aangezien een aside ook in een artikel (juist in een artikel) voorkomt krijg je dan weer hetzelfde verhaal.
Waarom ik het gebruik van IDs afraad voor CSS? Omdat je je dan heel erg beperkt. Als je een id="article-header" gebruikt zal je dus nooit meer dan 1 artikel header op je pagina mogen hebben. Is dat even een ramp voor de categorie pagina die tientallen artikels (de headers) laat zien :)
Omdat je nu nog niet weet wat je straks misschien wilt toevoegen zal ik dingen altijd zo min mogelijk beperkend maken. En als je dan toch al 95% classes gebruikt zou ik die andere 5% voor consistentie ook als class gaan gebruiken (en je weet maar nooit...).
Als je een id="article-header" gebruikt zal je dus nooit meer dan 1 artikel header op je pagina mogen hebben. Is dat even een ramp voor de categorie pagina die tientallen artikels (de headers) laat zien :)
Bij elementen die vaker op een pagina voorkomen snap ik dat het niet handig is daar een id te gebruiken. Maar een pagina heeft over het algemeen toch niet meer dan één header of footer? (Hiermee bedoel ik de header en footer van de body en niet persé alle headers en footers die in de body zitten, dit kunnen er natuurlijk meer zijn). En juist omdat deze header en footer maar één keer verkomen heb ik ze het id "header" en "footer" meegegeven. Of kan ik ze in dat geval beter het id "page-header" en "page-footer" meegeven?
>> En juist omdat deze header en footer maar één keer voorkoren heb ik ze het id "header" en "footer" meegegeven.
Dan krijg je <header id="header"> in plaats van gewoon <header>, wat bij één <header> nergens voor nodig is. Bij CSS moet je opletten dat je niet naar de specificity hell afdaalt.
>> En juist omdat deze header en footer maar één keer voorkoren heb ik ze het id "header" en "footer" meegegeven.
Dan krijg je <header id="header"> in plaats van gewoon <header>, wat bij één <header> nergens voor nodig is. Bij CSS moet je opletten dat je niet naar de specificity hell afdaalt.
Wanneer ik meerdere headers gebruik / ga gebruiken zou ik dit dus wel kunnen gebruiken:
<header id="header"></header>
Want eerder in dit topic werd juist gezegd dit niet te doen. :/
>> Wanneer ik meerdere headers gebruik / ga gebruiken zou ik dit dus wel kunnen gebruiken:
Nee, want een ID mag maar 1x voorkomen.
Je zou dus wel meerdere keren <header class="some_header"></header> kunnen gebruiken.
@Wouter:
Nog even terug komend op jouw verhaal ... eigenlijk gebruik jij dus classes om de (negatieve) gevolgen van overerving tegen te gaan. Daar komt het dan toch op neer?
