ugrás a tartalomhoz

különböző szélességű monitorok, eltérő szélesség

xeras · 2011. Feb. 18. (P), 17.22
Sziasztok,

van egy régi laptopom amit 1024*786on felbontással használom, és egy új ami 1280*800on van. Azt szeretném, hogy mindkettőn egyforma szélességgel jelenjen meg a tartalom (980px).

Ez a régi gépen 980px széles, míg az újon 784px.

Az oldalam:

body {
	text-align: center;
}

#content {
	text-align:left;
	margin:0px auto;
	width:980px;
	}

#header {
}

#main {
	float:left;
	width:620px;
}

#right {
	margin-left:620px;
}

#foot {
	clear:both;
}


<!doctype html>
<html lang=”hu”>
<head>
<meta charset=”utf-8”>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>


<div id="content">

	<div id="header">
		fejléc
	</div>

	</div>

	<div id="main">
		Lorem Ipsum
	</div>

	<div id="right">
		 Lorem Ipsum
	</div>

	<div id="footer">
		
	</div>
	
</div>


</body>
</html>
Ez miért történik? Mit lehet csinálni, hogy mindkét gépen 980px széles legyen?
Előre is köszönöm!
‹ lenyilo lista kerdes Több képi elem egy kép fájlban ›
 ■
1

kieg

xeras · 2011. Feb. 18. (P), 17.29
Megnéztem több oldalt is a két gépen (pl. weblabor,youtube) és azoknál nincs ilyen probléma, tehát gondolom a kódból hiányzik valami..
2

Hibák

Poetro · 2011. Feb. 18. (P), 17.56
A <html> és <meta> tagben hibásak az idézőjelek. A header után van egy valószínűleg felesleges </div>. Nem tudom te miképp kaptál 784px szélességet, mivel az egyáltalán nem szerepel az oldalon.

Esetleg leírhatnád a tesztelési módszereidet, mert nálam egyik féle szélesség sincs, csak 1680×1050, 1920×1080 illetve 1440×900 és a fenti javításokkal mindegyikben 980px széles.
<!doctype html>
<html lang="hu">
<head>
    <meta charset="utf-8">
    <style type="text/css">
    body {
        text-align: center;
    }
    #content {
        text-align:left;
        margin:0px auto;
        width:980px;
    }
    #main {
        float:left;
        width:620px;
    }
    #right {
        margin-left:620px;
    }
    #foot {
        clear:both;
    }
    </style>
</head>
<body>
    <div id="content">
        <div id="header">
            fejléc
        </div>
   
        <div id="main">
            Lorem Ipsum
        </div>
    
        <div id="right">
             Lorem Ipsum
        </div>
    
        <div id="footer">
        </div>
    </div>
</body>
</html>
3

tesztelés

xeras · 2011. Feb. 18. (P), 18.09
köszi a gyors választ! a tesztelési módszerem lehet kicsit megmosolyogtató, annyi hogy a header részbe beszúrtam egy vonalat, és ezután mindkét gépen printscreen + photoshoppal "lemértem" a hosszukat.

a te kódodat egy az egyben lemásoltam és maradt ugyanez a hiba:(

Gondolkoztam és szerintem a 784es szélesség így jöhet ki:
1280/1024= 1,25
980/1,25= 784px..

De az okát az nem értem még mindig.
5

:)

ironwill · 2011. Feb. 18. (P), 18.47
+1
Tudom, hogy ez már kiforrott technika.. :), de inkább használd a firebug layout részét, az sokkal pontosabb infókkal szolgál. (vagy akár a webdeveloper toolbar-t)
4

Nagyítás

Poetro · 2011. Feb. 18. (P), 18.45
Nem lehet hogy használod a böngésző vagy az operációs rendszer nagyítás, illetve kicsinyítés szolgáltatását? Általában a nagyítást a Ctrl + 0 gombok megnyomásával lehet visszaállítani 100%-ra. És lehetőleg próbáld ki több böngészőben is.
6

crtl+0

xeras · 2011. Feb. 18. (P), 19.06
ezer köszönet!!!