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:
  1. body {  
  2.     text-aligncenter;  
  3. }  
  4.   
  5. #content {  
  6.     text-align:left;  
  7.     margin:0px auto;  
  8.     width:980px;  
  9.     }  
  10.   
  11. #header {  
  12. }  
  13.   
  14. #main {  
  15.     float:left;  
  16.     width:620px;  
  17. }  
  18.   
  19. #right {  
  20.     margin-left:620px;  
  21. }  
  22.   
  23. #foot {  
  24.     clear:both;  
  25. }  
  1. <!doctype html>  
  2. <html lang=”hu”>  
  3. <head>  
  4. <meta charset=”utf-8”>  
  5. <link href="style.css" rel="stylesheet" type="text/css">  
  6. </head>  
  7. <body>  
  8.   
  9.   
  10. <div id="content">  
  11.   
  12.     <div id="header">  
  13.         fejléc  
  14.     </div>  
  15.   
  16.     </div>  
  17.   
  18.     <div id="main">  
  19.         Lorem Ipsum  
  20.     </div>  
  21.   
  22.     <div id="right">  
  23.          Lorem Ipsum  
  24.     </div>  
  25.   
  26.     <div id="footer">  
  27.           
  28.     </div>  
  29.       
  30. </div>  
  31.   
  32.   
  33. </body>  
  34. </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!
 
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.
  1. <!doctype html>  
  2. <html lang="hu">  
  3. <head>  
  4.     <meta charset="utf-8">  
  5.     <style type="text/css">  
  6.     body {  
  7.         text-align: center;  
  8.     }  
  9.     #content {  
  10.         text-align:left;  
  11.         margin:0px auto;  
  12.         width:980px;  
  13.     }  
  14.     #main {  
  15.         float:left;  
  16.         width:620px;  
  17.     }  
  18.     #right {  
  19.         margin-left:620px;  
  20.     }  
  21.     #foot {  
  22.         clear:both;  
  23.     }  
  24.     </style>  
  25. </head>  
  26. <body>  
  27.     <div id="content">  
  28.         <div id="header">  
  29.             fejléc  
  30.         </div>  
  31.      
  32.         <div id="main">  
  33.             Lorem Ipsum  
  34.         </div>  
  35.       
  36.         <div id="right">  
  37.              Lorem Ipsum  
  38.         </div>  
  39.       
  40.         <div id="footer">  
  41.         </div>  
  42.     </div>  
  43. </body>  
  44. </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!!!