Affiancare due o piu DIV
Autor: Giampy ッRagazzi dovrei AFFIANCARE questi due codici che uso in maniera tale da poter avere ad esempio la parte A a sinistra e la parte B a destra ma non ci riesco perchè se inserisco il codice cosi come è scritto me li mette uno sopra all altro..Come posso fare?
PARTE A
<div style="position:fixed; left:0px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block;width: 350px; height:350px; background-color:#DF1179; opacity: 1;">
<div style="text-align: center;padding-top:100px;padding-left:0px;">
<img src="files/logo.png" /></a>
</div>
</div>
</div>
</div>
PARTE B
<div style="position:fixed; left:0px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block;width: 350px; height:350px; background-color:#DF1179; opacity: 1;">
<div style="text-align: center;padding-top:100px;padding-left:0px;">
<img src="files/logo2.png" /></a>
</div>
</div>
</div>
</div>
Ciao, cambia la scritta left con right....
Autor
pero se io volessi aggiungere anche la Parte C ad esempio e quindi da formare la a a sinistra, la B centrale e la C a destra...non funziona se modifico solo gli allineamenti..
Uno lo metti left 0, uno lo metti right 0, e uno left es.200 poi modifichi tu il numero in base a dove lo vuoi.
E qui un'esempio:
http://mibo.altervista.org/calcio/divfixed1.html
Se ho capito bene, "la B centrale", proverei così:
<div style="position:fixed; left:<b>-175</b>px; margin-left: 50%; bottom:0px;z-index:100001;">
[...]
Dove -175px è la metà della larghezza del div.
Se centrale è "al centro" per tutti...
Da provare con i vari browser.
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Togliere <b> e </b> naturalmente... Answers è proprio il massimo per scrivere codici...
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Provato con l'immagine in basso come detto da Lemonsong cambiando leggermente il codice, e funzia meglio... cosi stà sempre al centro...
http://mibo.altervista.org/calcio/divfixed1.html
Grazie per la prova Mirko.
Ogni volta che clicco i tuoi esempi mi soffermo un po' di più del solito, chissà perché...
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Non devi guardare tutte le.....sfondi
Autor
Pero ragazzi io questi div li inserisco all interno dello script che va ad aprirsi quando si clicca su "apri" per capire meglio guardate qui: www.wimbledonpaint.com/2
Non vedo il tasto apri, ma se intendi accedi, mettilo nella pagina login.html
Autor
Ragazzi sono riuscito a affiancarli, solo che adesso ce un problema:
se visitate questo sito:
http://www.wimbledonpaint.com/2/
noterete che la parte di sotto che si apre a cui sto lavorando, non si allinea bene a secondo della larchezza della pagina.
i codice che ho usato per richiamare le 3 sezioni è il seguente:
<div style="position:fixed; left:0px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block; width: 1920px; height:400px; background-color:#DF1179; opacity: 1;">
</div>
</div>
</div>
<div style="position:fixed; left:40px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block; width: 350px; height:400px; background-color:#DF1179; opacity: 1;">
<div style="text-align:left;padding-top:100px;padding-left:0px;">
<img src="files/logo-wim.png" /></a>
</div>
</div>
</div>
</div>
<div style="position:fixed; right:0px;margin-right: 370px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block;width: 350px; height:400px;">
<div style="text-align: center;padding-top:15px;padding-left:0px;">
<div id="mioform">
<br>
<div style="text-align: center">
<span style="font-family:Arial; font-size:16pt; color: #FFFFFF"><b>REGISTRATI</b></span></div>
<div style="text-align: center">
<span style="font-family:Arial; font-size:10pt; color: #FFFFFF">___________________________________________</span></div>
<br>
<div class="areautente" style="width: 100%; margin-top: 5px; text-align: center">
<span style="font-family:Corbel;Arial; font-size:12pt; color: #696969">
<img src="files/utente.png" /></span></div>
<br>
<div style="text-align: center">
<span style="font-family:Arial; font-size:12pt; color: #FFFFFF">
<p>Non sei ancora registrato?</p>
<b>Crea il tuo account gratuitamente.</b></span></div>
<br>
<div class="imLoginBlock" style="width: 100%; text-align: center">
<a href="http://www.wimbledonpaint.com/registrazione.html">
<input type="image" src="files/registratii2.png"></a></div>
<br>
<br>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="position:fixed; right:0px;margin-right:25px; bottom:0px;z-index:100001;">
<div id="mioform">
<div style="float:left; display:block;width: 350px; height:400px; ">
<div style="text-align: center;padding-top:15px;padding-left:0px;">
<div id="mioform">
<div id="mioform">
<br>
<div style="text-align: center">
<span style="font-family:Arial; font-size:16pt; color: #FFFFFF"><b>LOG IN</b></span></div>
<div style="text-align: center">
<span style="font-family:Arial; font-size:10pt; color: #FFFFFF">___________________________________________</span></div>
<br>
<br>
<div id="imLogin" style="width: auto" text-align: center>
<form method="post" action="imlogin.php">
<div style="text-align: center">
<div class="imLoginBlock" style="width: 100%;">
<label for="imUname"><span style="font-family:Arial; font-size:11pt; color: #FFFFFF">Username:</span></label><br />
<input type="text" name="imUname" id="imUname" style="border: 1px solid #E6E6E6; font-family:Arial; font-size:15pt; background-color: #FFFFFF; color: #81BEF7; width: 230px"><br/></div>
<div style="text-align: center">
<div class="imLoginBlock" style="width: 100%;">
<label for="imPwd"><span style="font-family:Arial; font-size:11pt; color: #FFFFFF">Password:</span></label><br/>
<input type="password" name="imPwd" id="imPwd" style="border: 1px solid #E6E6E6; font-family:Arial; font-size:15pt; background-color: #FFFFFF; color: #81BEF7; width: 230px"><br /></div>
</div>
<div class="imLoginBlock" style="width: 100%; margin-top: 20px; text-align: center">
<input type="image" src="files/accedii2.png" value="accedi" class="imLoginSubmit">
</span></div></div>
</form>
<br>
<div style="text-align: center">
<span style="font-family:Arial; font-size:10pt; color: #FFFFFF">___________________________________________</span></div>
<br>
<div class="imLoginBlock" style="width: 100%; text-align: center">
<a id="log" href="login.html"><img src="files/close.png" alt="login" width="118" height="33" /></a></div>
</div></div></body></span>
</div>
</div>
</div>
</div>
</div>
Ma questo dove si trova???
files/utente.png
Ti consiglio di rivedere un po' il tutto, attualmente:
Anche se con tutti questi errori sembra fungere "abbastanza bene/male" sarebbe opportuno scrivere codici "puliti" per evitare problemi presenti e futuri.
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Autor
Lemonsong lo sò, hai ragione infatti non sono molto bravo da comepuoi vedere, quindi, da solo non riuscire mai ad aggiustare il codice e diverse volte mi é stato fatto presente questo problema. Ma per quanto riguarda l allineamento che non é perfetto se non si ha una risoluzione minima, come posso fare? Xke ad esempio da ipad lo vedo bene xke la risoluzione è stretta, invece da pc, è tutto sballato...
Mi dai ragione ma se lasci tutto com'è è un pasticcio metterci le mani.
La "parte di sopra" spero che la toglierai, altrimenti non capisco il senso di quello che attualmente vedo.
Per centrare il div della registrazione (parte di sotto), hai avuto delle indicazioni, pure con un esempio online.
Attalmente vedo questo nel CSS in linea: right:0px;margin-right: 370px;
... perché non provi così? right: 50%; margin-right: -175px; (è scritto qualche post sopra con left ma la filastrocca dovrebbe essere la stessa)
Scrivo "provi" perché in quel groviglio non so se le "leggi dei CSS" funzioneranno
_______ oltre il 5° step ________
http://www.unofficialwsx5.com
Autor
Sisi la parte di sopra la eliminerà però priva la prendo di riferimento per gli allineamenti ecc ecc..vedo cosa riesco a fare e in caso vi faccio sapere ;)