Avatar billede flemche Nybegynder
06. april 2012 - 16:11 Der er 7 kommentarer og
1 løsning

Hvad er best practice når man arbejder med skærmopløsning.

Hejsa

Jeg er i min spæde start af programmering af HTML/CSS.

I den forbindelse er jeg ved at lave en side som jeg vil fastsætte til skærmopløsningen 1024x768.

Jeg har læst mig til at man løser dette ved at lave en "wrapper" (div tag) som har den skærm størrelse som man gerne vil have.
Dette er "No problem".

1) Jeg kan bare ikke helt regne ud hverdan man så positionerer denne wrapper så den lægger sig midt i skærmen (horisontalt) for dem der kører en højre opløsning end de 1024x768.

2) Hvor lægger man normalt wrapperen vertikalt (Top / centreret), og hvordan.

3) Er der en anden måde som er bedre at bruge end det jeg har gang i ???  :o)

På forhånd TAK.

/Lemche.
Avatar billede mireigi Novice
06. april 2012 - 17:57 #1
<div style="width: 100%">
  <div style="width: 996px; margin: 0 auto;">
      ...
      ...
      ...
      ...
  </div>
</div>


Det er margin auto som får det centreret.
Avatar billede flemche Nybegynder
06. april 2012 - 18:29 #2
Ok, den skal jeg liga have uddybet om jeg forstår det rigtigt.

- De "100%" er på "body" så den fylder hele vinduet ud når man har højre opløsning end 1024x768.

- De "996px" er det reelle browser vindue, da men har trukket div. ting fra i browseren.

- "margin: 0 auto" er 0px i toppen og browseren sørger selv for at centrerer siderne. Bottom giver jo sig selv hvis man så også sætter en height ind.

Er det rigtigt forstået ???

Og så var der lige spørgsmålet omkring om det er best practice at sætte margin-top til 0 eller om det er som designeren synes det ser bedste ud.


/Lemche
Avatar billede mireigi Novice
06. april 2012 - 22:46 #3
Det er ja til det hele.

Om det er best practice tør jeg ikke sige. Jeg syntes personligt selv at det er bedst der ikke er noget mellemrum mellem toppen af indholdet og browserens øverste kant.

Så længe det validerer mod W3C, kan jeg ikke se noget problem i at du gør som det passer dig eller kunder ønsker.
Avatar billede olebole Juniormester
07. april 2012 - 00:55 #4
<ole>

DIV'et med width:100% er ganske overflødigt. Om du skal have margin i toppen, kommer helt an på det design, der skal implementeres - og det kommer jo også an på, om du har fjernet margin/padding fra BODY.

Til gengæld er det god kodeskik aldrig at lave tekstlinjer længere end 600-650 pixels. Længere linjer nedsætter læsbarheden i væsentlig grad

/mvh
</bole>
Avatar billede flemche Nybegynder
10. april 2012 - 10:36 #5
Mange tak for de brugbare svar.

@Mireigi sender du lige et svar så du kan få dine point.

/Lemche
Avatar billede mireigi Novice
10. april 2012 - 12:36 #6
Et svar skal du få.

Du bør dog give olebole en del af pointene for at have svaret på delen om best practice.
Avatar billede flemche Nybegynder
10. april 2012 - 21:50 #7
Det er selvfølgelig rigtigt.

@olebole: smid et svar så får du også nogle point med.  :o)
Avatar billede olebole Juniormester
10. april 2012 - 22:01 #8
Ellers tak, jeg samler ikke point  =)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester