hemsida hoppar mellan olika flikar

Det beror oftast på scrollisten. Om du har en sida som inte fyller ut hela höjden visar inte webbläsaren någon scrolllist, och då hoppar sidan i sidled om du går från en flik med mer innehåll. Förutsatt att sidan har en centrerad design.

Detta är sällan nåt man kan göra någonting åt, och den enda som bryr sig är antagligen du själv.

Nja, snarare min webdesign lärare som vägrar ge mig MVG om jag inte fixar det och optimering till alla webläsare!

Lade in:

}
	{
	overflow-y:scroll;
}

Det funkar, men då försvinner min header :S

Självklart han någon svara innan jag redigerade :P, blev lite felskrivet, tack så hemskt mycket.

Nu måste jag bara optimera för alla webläsare, när jag använder <h1>, <h2> så tolkar IE det på ett helt annat sätt. Vad ska jag använda för kod för att få upp storleken?

MVH

1 em motsvarar enligt ursprungsspecifikationen bredden på bokstaven M i den font som används. I webbläsare motsvarar 1 em istället 100 % av fontens pixelhöjd. Om ett element är satt till 0.5 em och i sin tur har barnelement satta till 0.5 em får dessa barn hälften-av-hälften till höjd, eller 0.25 em av ursprungstypens höjd.

När det gäller fontstorlek är font-size: 1em det samma som font-size: 100%.

Grafiska webbläsare har en grundläggande CSS-mall som bland annat sätter typsnitt, men 16 px är inget magiskt värde. På min netbook har jag exempelvis satt utgångsvärdet till 13 pixlar.

Det enda sättet att ha 100 % koll på att 1 em är 16 pixlar i hela dokumentet är att sätta exempelvis body {font-size:16px} vilket är mindre användarvänligt.

Kanske går lite off-topic nu, men hur vet man då att 1em ser lika ut hos alla besökarna? Em-måttet är en av sakerna jag läst lite om men aldrig riktigt förstått.

Det vet du inte, och är lite syftet. Tanken är att användaren har konfigurerat sin webbläsare för att passa sina behov, sedan bygger du en sida som är dynamiskt anpassad till det.

Tänk att du har en sida som innehåller:
<h1 style="font-size: 2em;">Min sida</h1>
<p>Här är min fina sida där jag skriver lite om vad som händer i mitt liv</p>
<h2 style="font-size: 1.5em;">Om mig</h2>
<p>Jag är en snäll och glad person som gillar att skriva om va som händer i mitt liv!</p>

Användare 1 är ung och läser mycket och fort. Hans webbläsare är konfigurerad till att visa text i 10px så han får med mycket information som kan läsas snabbt.

Användare 2 har dålig syn och har sin webbläsares text konfigurerad till 18px för att kunna förstå hemsidorna han besöker.

Ditt h1-element säger "visa mitt innehåll i dubbelt så stor storlek som min förälders text", för användare 1 är det 20px och anpassat till hans behov. Han ser att elementet har något högre vikt än p-elementen som visas i 10px (brödtext typ). För användare 2 visas h1 i 36px och användare 2 förstår på samma sätt som användare 1 att elementet försöker framhäva något.

Samma för h2-elementet.

Hade du haft h1-elementet såhär:
<h1 style="font-size: 18px;">Min sida</h1>

Så hade användare 1 antagligen uppfattat innehållet på ungefär samma sätt, men användare 2 hade inte sett någon skillnad på h1-elementet och p-elementen.

Dynamiskt och mysigt.

Sedan kommer dilemmat:

Användare 3 bryr sig inte om vilken webbläsare han använder, eller om han sitter på sin bärbara, stationära med 28" skärm, på ett webbcafe eller på en pentium III i något u-land. Han förväntar sig bara att när han besöker din sida så visas den på samma sätt som han är van vid (statiskt).

Edit:
Går ju att vända och vrida lite hur som, sätter du din bodys font-size till ett visst pixel-värde så kommer h1-elementets em anpassas till det. Hade nog kunnat vrida runt detta i ett oändligt långt inlägg som resulterar i att alla som inte tycker lika känner sig förolämpade. Dynamiskt/statiskt, em och allt sånt är en debatt som många känner starkt om... Hoppas jag lyckades svara på din ursprungsfråga i alla fall.