position: absolute --> però mi si sposta tutto...!

19-01-2012, 16.33.24

ciao a tutti! sono nuovo sia del forum sia del mondo html e affini. mi è quasi un linguaggio alieno ma con molta fatica ho fatto un piccolo sito per un esame che devo dare:

http://gelkindo.altervista.org/

il problema è che quasi tutti gli elementi (a parte il logo "gelkindo" fisso in alto a sinistra in tutte le pagine) si "spostano" quando vado a ridimensionare la finestra del browser... non riesco a capire il motivo. il logo a differenza degli altri elementi è un'immagine di background e non mi da problemi. è tutto il resto che va per i fatti suoi...

**acsocmel** · 19-01-2012, 17.47.48

position absolute funziona in relazione all'elemento genitore, in questo caso "body"
in genere il body corrisponde alla finestra e quindi ridimensionandola cambi i riferimenti agli oggetti posizionati in maniera assoluta
tutti i tuoi elementi si spostano perchè hai usato le percentuali
se avessi usato i px starebbero inchiodati in quella posizione (in realtà dipenderebbe da left o right)
comunque ti consiglio di rifare tutto partendo dallo studio dell'xhtml
ti mostro il codice base di una pagina xhtml

Codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="tuo file css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
</body>
</html>

19-01-2012, 19.07.40

ho provato ad usare i pixel ma non cambia niente... per quanto riguardo lo studio xhtml purtroppo non ho il tempo di ripartire da capo. è già tanto se son riuscito a tirar fuori qualcosa di più o meno funzionante... e pensare che dopo mi toccheranno i css brrrrr

**acsocmel** · 20-01-2012, 14.56.14

come vedi la tua homepage usa percentuali e non px
ma non è questo il problema
il problema è che stai usando già position, l'ultima cosa che devi studiarti visto le complicanze insite
devi leggere una guida per non andare avanti a tentoni
se ho imparato io, allora tutto il mondo può imparare
questo codice è esattamente quello che non bisogna fare

Codice HTML:

<HTML>
<HEAD>
<META NAME="GENERATOR" Content="AlterVista - Editor HTML">
<TITLE>gelkindo | dritto al punto</TITLE>


</HEAD>
<BODY>

<DIV STYLE="position:absolute; top:20%; left:20%">
 <a href="home.html"><img src="immagini/home.png"></a> </div>
<DIV STYLE="position:absolute; top:20%; left:37%">
 <a href="info.html"><img src="immagini/info.png"></a> </div>
<DIV STYLE="position:absolute; top:20%; left:53%">
 <a href="portfolio.html"><img src="immagini/portfolio.png"></a> </div>

<DIV STYLE="position:absolute; top:20%; left:72%">
 <a href="contacts.html"><img src="immagini/contacts.png"></a> </div>

<div style="position:absolute; top:40%; left:27%"> 
<h2> <font color="#000000" face="Hand Of Sean">
" Tutta la faccenda del fumo, delle sigarette<br>  
è come una truffa di proporzioni gigantesche.<br> 
Anche le persone intelligenti possono venir truffate,<br> 
ma è solo un pazzo chi, avendo scoperto la truffa,<br> 
continua a farsi imbrogliare ".
</font>

</div>

<div style="position:absolute; top:75%; left:62%"> 
<h2> <font color="#38a962" face="Hand Of Sean">
Allen Carr
</font>
</div>

</h2>



<body background="immagini/sfondo.jpg" >

<div style="position:absolute; top:20px; left:160px">
<a href="home.html"><img src="immagini/logo.png" width="239,5px" height="77,5"></a>

</div>


</BODY>
</HTML>

Discussione: position: absolute --> però mi si sposta tutto...!

LinkBack

Strumenti discussione

Display

position: absolute --> però mi si sposta tutto...!

Tags for this Thread

Regole di scrittura