Problema ridimensionamento!!!!

**giacomo99** · 14-11-2011, 16:03

Ciao a tutti!!!
ho una pagina dove ci sono tutti gli elementi che sono contenuti in dei div....
quando vado a "restringere" la pagina del browser o a cambiare la risoluzione dello schermo gli elementi si sovrappongono....
Questo è il codice:

codice:

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta name="description" content="Sito dedicato agli alunni della scuola secondaria di primo grado di Assisi 'G. Alessi'>
<meta name="keywords" content="scuola media primo grado alunni galeazzo alessi secondaria assisi">
<title>G. Alessi | Login</title>
<style>
body {background:white; height:100%; width:100%;}
div#body{width:100%; heigth:100%;}
#logo {position:relative; left:30%; background:url(immagini/sfum_grigia.jpg); height:200;}
#vai_chat {background:white; position:absolute; top:40%; left:25%;}
#vai_compiti {background:white; position:absolute; top:60%; left:25%;}
#pubb_1 {position:absolute; left:8%; top:25%; float:right;}
#pubb_2 {position:absolute; left:85%; top:25%; float:right;}
#cliccate_pubb {position:absolute; top:80%; left:25%;}
#login {position:absolute; top:33%; left:37%; color:green; font-size:35px; font-weigth:900; float:left; clear:both;}
#submit {position:relative; left:60%; top:-80px; width:70px; height:40px;}
p {font-weigth:900; font-size:23px; color:green;}
a {color:red;}
</style>
</head>
<body><div id=body>

<table id="logo" border="0">
<tr>
<td>
<a href=http://giacomo1999.altervista.org/>
<img src=immagini/assisi.jpg>
</a>
</td>
<td>
<a href=http://giacomo1999.altervista.org/>
<img src=immagini/logo.jpg>
</a>
</td>
</tr>
</table></a>

<div id=pubb_1>
<script type="text/javascript">
//<![CDATA[
document.write('<s'+'cript type="text/javascript" src="http://ad.altervista.org/js.ad/size=120X600/r='+new Date().getTime()+'"><\/s'+'cript>');
//]]></script>
</div>

<div id=pubb_2>
<script type="text/javascript">
//<![CDATA[
document.write('<s'+'cript type="text/javascript" src="http://ad.altervista.org/js.ad/size=120X600/r='+new Date().getTime()+'"><\/s'+'cript>');
//]]></script>
</div>

<div id=login>
Se sei registrato inserisci i tuoi dati qui:
<form action=login.php method=post name=login>


nickname:&nbsp <input type=text></input></p>


Password:&nbsp <input type=text></input></p>
<input id=submit type=submit value=conferma></input>
</form>
Oppure <a href=registrazione.php>REGISTRATI</a>
</div>

**ResianTaxidrive** · 15-11-2011, 04:50

questo è molto probabilmente dovuto al fatto che hai messo dappertutto posizionamenti assoluti.
Questo tipo di posizionamento è da usare solo in certi casi e avendo ben in mente cosa si sta facendo. Togli intanto tutti questi posiz e vedi cosa succede.

**ldetomi** · 15-11-2011, 10:51

Non ho avuto tempo di analizzare tutto il codice con calma (anche percghé c'è un sacco di roba che complica solo le cose e non aiuta a centrare direttamente il problema, es. cdata, ecc....)
Però l'idea dei posizionamenti assoluti è giusta. Probabilmente non li posizioni rispetto a un contenitore ma rispetto al body, la cui dimensione cambia con il cambio di zoom, ed ecco perché tutto va insieme!!

Posta un codice (e soprattutto un link) ridotto all'osso, e poi vediamo

**giacomo99** · 15-11-2011, 15:09

Grazie per i consigli intanto
poi per le parti cdata sono solamente banner pubblicitari ma non ho avuto il tempo di toglierli.
Provero a togliere gli spostamenti assoluti. Quelli relativi anche devo togliere??

**ldetomi** · 15-11-2011, 18:35

Beh... in generale, quando chiedi qualcosa su un forum, semplifica la vita a chi ti aiuta, metti solo il codice strettamente necessario, non chiedere agli altri di capire cosa non serve e cosa sì....

Detto questo, i posizionamenti puoi lasciarli tutti, anche gli assoluti, il problema è rispetto a cosa fai il posizionamento!!! Il posizionamento assoluto è fatto rispetto al primo oggetto "padre" posizionato o in maniera relativa o assoluta a sua volta. Se tale oggetto non c'è, viene fatto rispetto al body che, come detto sopra, cambia la sua dimensione con lo zoom... quindi dai position:relative a un div contenitore e vedrai che tutti gli oggetti dentro resteranno fermi

**giacomo99** · 16-11-2011, 22:56

Grazie!!!!
potete vedere il problema su questo sito:
http://giacomo1999.altervista.org/

quindi dovrei creare un div contenitore per ogni elemento o uno che contiene tutto???

**ldetomi** · 16-11-2011, 23:23

Hai postato un link in cui gli oggetti sono sovrapposti ma......... a qualsiasi livello di zoom.... come si fa ad aiutarti così????

**giacomo99** · 16-11-2011, 23:25

scusate ma stavo provando a risolvere e ho fatto un pasticcio!!! ora ho risolto!!!!

**ldetomi** · 16-11-2011, 23:34

La versione online non è propriamente a posto... adesso sì che con lo zoom cambiano i posizionamenti... guarda la scritta nell'intestazione o i rettangoli al centro che invece rimangono sempre uguali (a proposito... come caspita hai fatto a fare in modo che restassero sempre uguali???

)

**giacomo99** · 16-11-2011, 23:41

la scritta perche è un'immagine!!!!

invece i rettangoli non restano uguali ma si restringono!!!
io vorrei che restassero uguali e apparisse lo scroll orizzontale che invece appare solo per mostrare le immagini!!!!

come posso fare????

Discussione: Problema ridimensionamento!!!!

Strumenti discussione

Ricerca discussione

Visualizza

Problema ridimensionamento!!!!

Permessi di invio