Resolutie...

Status
Niet open voor verdere reacties.
SamirAlieev

SamirAlieev

Gebruiker
Lid geworden
28 jan 2011
Berichten
99
Beste leden,

ik heb een vraag..

Als we nou als voorbeeld Facebook.com nemen.. maak niet uit met welke resolutie je erop gaat de website zal altijd perfect op je scherm passen..

Nu mijn vraag hoe doe ik dit op mijn eigen site?

Groeten.
 
Dag SamirAlieev,

Sites maken vaak gebruik van een width in percentage en een minimum-width in pixels. De width zorgt er dus voor dat de site zich zal aanpassen aan de grootte van het scherm, is iemand zo leuk om het scherm piepklein te maken, blijft de site op een bepaald aantal pixels width hangen, de min-width.

Verder valt het ook nog eventueel te doen door margin te zetten aan de linker en rechterkant van de website, op deze manier kan je min of meer je content bij elkaar laten drukken als het scherm wordt verkleind.

Vriendelijke groet,

Bart
 
Bedankt voor je reactie Bart!,

Kun je mij een voorbeeld hiervan geven aangezien ik niet zoveel ervaring heb begrijp ik het niet zo helemaal..
Bedankt voor je tijd ;)

Groeten.
 
Dag SamirAlieev,

Ik heb zo gauw geen simpel voorbeeldje voor je in normaal HTML klaarliggen aangezien ik mijn websites maak in asp.net. Ik denk dat het makkelijkste voor je is om alle widths in percentages te zetten: http://www.w3schools.com/cssref/playit.asp?filename=playcss_width&preval=50%.
Je plaatst als het ware i.p.v. bijvoorbeeld 100px, 20%. Deze 20% wordt dan gezien als de 20% van de breedte van je browser.:thumb:

Oké, een klein voorbeeldje met CSS (ik hoop dat je hiermee wel bekend bent :P)

HTML: 
.menu
{
    width: 20%;
    min-width: 75px;
}

Als deze style wordt toegepast op bijvoorbeeld een div, zal deze div 20% van de breedte van de pagina gebruiken. Is deze 20% in totaal kleiner dan 75px, blijft hij op 75px hangen. Zo wordt dat gedeelte van je website dus nooit smaller dan 75px!

Als ik je met nog iets uit kan helpen, hoor ik het graag :thumb:

Vriendelijke groet,

Bart
 
Bedankt Bart!

Nu begrijp ik het alleen het uitvoeren wordt wel lastig natuurlijk.

Dus als ik het goed begrijp..

Moet het zo:

HTML: 
<head>
<title>Voorbeeld</title>
</head>

<style type="text/css" 
.menu
{
width: 20%;
min-width: 75px;
}
</style>

(Ik heb wel het gevoel dat ik paar fouten heb :P)
 
@SamirAlieev,

Volgens mij moet het zo:
HTML: 
<head>
<title>Voorbeeld</title>
</head>
 
<style type="text/css">
.menu
{
width: 20%;
min-width: 75px;
}
</style>
 
@ WDHBGS

Ja inderdaad klopt ik ben de style vergeten te sluiten bedankt voor je correctie ;)

groeten.
 
Jazekers, klopt zo :) Deze stijl kun je dan gaan toepassen. Vervolgens kun je dus je pagina opdelen in een aantal secties met div-jes. Elke div zal dan een apart percentage van de pagina in gebruik gaan nemen en samen in de width 100% moeten beslaan.
Pas op, als je gebruik gaat maken van margin. Als je margin gebruikt m.b.t. de linker of rechterzijde zal dit van de 100% width afgaan!

Veel succes, ik hoor het wel als je nog vragen hebt! :thumb:

Vriendelijke groet,

Bart
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan