html/css pixlar eller procent??

Det beror helt på i vilket sammanhang och vad du strävar efter att uppnå.

Om du har en div på det här viset och du vill att den ska ligga vertikalt centrerad, oavsett skärmstorlek, så är % att föredra.

Sätter du 200px margin-top ser det kanske bra ut på din morfars lilla datorskärm, men om någon med en mycket större skärm kollar på samma sida så blir det väldigt lite marginal jämfört med botten. Därför är det då bättre att sätta margin-top med % istället för px i detta specifika fallet.

När jag kodar i skolan så brukar jag alltid använda mig utav pixlar för att forma layouten på olika saker så som boxar, avstånd mellan boxar, storlek på bilder osv osv, och varför jag gör det är för att jag tycker det är mycket enklare att räkna i pixlar på en datorskärm än att räkna i procent Men det är jag, du får testa dig fram! Men jag själv skulle rekommendera pixlar.

Brukar köra en "masterdiv" som jag lägger allting annat i. På masterdivven kör jag procent eller margin: 0 auto; tricket. Innuti masterdivven kör jag pixlar.

Det här är ett bra tips tycker jag. Förresten, att skriva margin: 0 auto; fungerar lika bra. Att ange enheten är bara onödigt då det ändå är noll.

Det har du rätt i. Har rättat mig själv

Hm, jag brukar göra tvärtom. Bredd i pixlar på den omslutande diven och % inuti....
Storlek på bilder alltid i pixlar. Förutom om det ligger en bild som bakgrundsbild som täcker hela skärmen, vill säga.

Vill du att något ska ha en bredd på 66.667% så använder du självklart procent. Vill du att något ska ha en bredd på 300 pixlar så använder du pixlar. Inget är mer rätt än det andra; det är två olika verktyg för två olika saker.

Generellt sätt använder man sig mest utav pixlar eftersom när du användar procent kan du stöta på sub-pixel problem (delar du 100px på 3 så får du 33.333px, och hur hanterar webbläsare det? På helt olika sätt, såklart!) men i rätt lägen är det självklart väldigt praktiskt.

För bilder använder jag ofta procent. Som en grundregel vill jag att en bild aldrig ska vara större än sin container, så jag säger:

img { 
    max-width: 100%;
    height: auto !important;
}

Det gör så att bilder aldrig "läcker utanför" sin container när de är för stora och att de bibehåller sina rätta proportioner när de trycks ihop. Vissa bilder vill jag att de alltid ska vara 100%, så istället för att sitta och krångla med varje bild så att den har exakt rätt antal pixlar i bredd så säger jag helt enkelt att bilden alltid ska ha en bredd på 100%.

I övrigt vill jag rekommendera att så sällan som möjligt använda width eller height. Om nödvändigt, använd min-width eller min-height (eller max-) istället.

Enligt The Principles of Beautiful Web Design

Och den sidan ser bra ut på din telefon sen?