Hoe maak je 'elastische spaties' aan de zijkant van je pagina?

Question

Sommige beeldschermen hebben een 1:1 verhouding en sommigen bijv. 16:19. Maar hoe zorg je dat je website altijd goed weergegeven wordt. En dan bedoel ik dat de website gemaakt wordt voor 1:1 beeldscherm en dat er bij bredere schermen een witte balk aan de zijkant komt.

Bedankt

 · Accepted Answer

Wat je zoekt in de css "margin: 0 auto". Voorbeeld:

Hier komt de inhoud in. :D

Met margin: 0 auto; centreer je de div tag in het scherm. width: 300px betekend dat de div tag 300 pixels breed is. height: 100% betekend dat hij het scherm van boven tot beneden vult. (Voor de duidelijkheid.) background-color: Yellow betekend dat de achtergrond van de div tag geel is. (Zo kun je goed zien dat het gecentreerd is.) Good luck. :) Toegevoegd na 2 dagen: Als je wil dat deze functie ook in IE 7 en 8 werkt, is het wel verplicht om deze regel helemaal bovenaan je html te zetten: Dus in totaal wordt het dan:

Hier komt de inhoud in. :D

 · Answer

Wanneer je tekst uitvult in plaats van links, rechts of midden uitlijnt, dan zul je zien dat de elke regel even breed wordt.
In het Engels (en dus HTML e.d.) noemt men dit justify.
 Zie de bron voor meer uitleg hierover.

rose · Answer

Deze oplossing werkt ook in oudere (b.v. IE8 of ouder) browsers:

Hier kun je plaatsen wat je wilt

left: 50% zet de linkerkant van je content in het midden margin-left: -400px schuift je content met de helft van je width naar links (waardoor de helft rechts en de helft links van het midden (left 50% !) komt) Toegevoegd na 22 uur: n.a.v. de opmerking van ivar: Als je in je header het volgende script opneemt: en de openingstag van je body verandert in: dan voorkom je dat bij kleine vensters er inhoudt aan de linkerkant verdwijnt.

Hoe maak je 'elastische spaties' aan de zijkant van je pagina?

Het beste antwoord

Andere antwoorden (2)

Bekijk alle vragen in deze categorieën: