allineare delle immagini

Micogian · Messaggio da **Micogian** » 21/09/2018, 13:37

Se dividi in percentuale non arrivare mai al 100%, puoi mettere tutti a 24% (se fai 4 colonne) oppure lasci a 25% le prime 3 e fai il 24% l'ultima.
Per le immagini tu hai messo un valore del 35% ma va calcolato nel riquadro che è il 25% della pagina, quindi il 35% del 25%
Tra l'altro devi aver fatto un errore perchè hai messo

Codice: Seleziona tutto

max width="35%"

dovrebbe essere "max-width", infatti se vedi il codice sorgente della pagina si presenta un errore perchè viene preso solo il width.

eniac · Messaggio da **eniac** » 21/09/2018, 16:13

Grazie ancora Micogian, ho corretto l'errore ,ed impostata l'ultima voce al 24% come mi hai suggerito, per le immagini avevo messo una percentuale perché nelle prove stavo usando una immagine identica per tutti i link, ma adesso che man mano inserisco le immagini reali sto usando i pixel, questo è il codice l'ho provato a varie risoluzioni dal minimo che attualmente si usa, 1280x800 fino a 1920x1080 passando da 1440x900 e sembra che vada tutto bene, quando hai un attimo però se mi dai un'occhiata al codice per vedere eventuali altri errori te ne sarei grato. Un'ultima cosa vorrei cambiare il colore di fondo da quello attuale a bianco, cosi evito di dovermi scontornare tutte le immagini, ma non ci riesco, è obbligato dal colore del forum per caso ?

Codice: Seleziona tutto

<!-- INCLUDE overall_header.html -->
 
<h2>Le schede tecniche del CeSIM</h2>
 
<div class="panel">
	<div class="inner"><span class="corners-top"><span></span></span>
 
	<div class="content">
		<p>
		     LA PAGINA E' IN COSTRUZIONE -Visita questa pagina fra qualche giorno per vedere lo stato di avanzamento!!!
			 <br><br><br>
			 	 
		 <div style="width: 100%">
		 <font size="2">
		 <b>
			<div style="float:left; width: 25%;">7,5 x 58 A cura di Luca RICCI<a HREF=http://cesimmunizioni.eu/forum/ecra/7,5x58.pdf> <img src=portale/75x58.jpg width="240px"> </div></A>
			<div style="float:left; width: 25%;">8 x 59 RB A cura di Luca RICCI<a HREF=http://cesimmunizioni.eu/forum/ecra/8x59RBricci.pdf> <img src=portale/8x59.png width="240px"></div></A>
     		<div style="float:left; width: 25%;">12,7 x 81 SR A cura di Luca Ricci<a HREF=http://cesimmunizioni.eu/forum/ecra/127bredaricci-new.pdf> <img src=portale/127breda.jpg width="240px"></div></A>
	       	<div style="float:left; width: 24%;">9 x 19 Italia - 9M38 A cura di Luca Ricci<a HREF=http://cesimmunizioni.eu/forum/ecra/9m38ricci.pdf> <img src=portale/m38.PNG width="240px"> </div></A>  
				  <div style="clear: both;"></div>
</div> 
<br><br>
 <div style="width: 100%">
			
			<div style="float:left; width: 25%;">QUESTO è IL QUINTO PULSANTE<a HREF=http://cesimmunizioni.eu/forum/ecra/8x59RBricci.pdf> <img src=portale/download.png width="35%"></div></A>
     		<div style="float:left; width: 25%;">QUESTO è IL SESTO PULSANTE<a HREF=http://cesimmunizioni.eu/forum/ecra/7,5x58.pdf> <img src=portale/download.png width="35%"></div></A>
	       	<div style="float:left; width: 25%;">QUESTO è IL SETTIMO PULSANTE<a HREF=http://cesimmunizioni.eu/forum/ecra/7,5x58.pdf> <img src=portale/download.png width="35%"> </div></A>  
			<div style="float:left; width: 24%;">QUESTO è L'OTTAVO PULSANTE<a HREF=http://cesimmunizioni.eu/forum/ecra/7,5x58.pdf> <img src=portale/download.png width="35%"> </div></A>
				  <div style="clear: both;"></div>
</div>
</font>
</b>
		</p>
	</div>
 
	<span class="corners-bottom"><span></span></span></div>
</div>
 
<!-- INCLUDE jumpbox.html -->
<!-- INCLUDE overall_footer.html -->

Cattura.PNG

Micogian · Messaggio da **Micogian** » 21/09/2018, 17:54

Il colore di fondo è dato dalla classe "panel" del file di sistema colours.css
Puoi sempre aggiungere un colore diverso in questo modo

Codice: Seleziona tutto

<div class="panel" style="background-color: #FFFFFF;">

oppure modificando il colore alla classe panel se hai un css personalizzato.
Un'altra soluzione sarebbe quella di creare delle immagini trasparenti (gif o png) in maniera che non si veda il bianco di sfondo.

Togli la parte di codice

Codice: Seleziona tutto

<span class="corners-top"><span></span></span>

e anche quella finale

Codice: Seleziona tutto

<span class="corners-bottom"><span></span></span></div>

perchè non serve, l'arrotondameno del pannello è già inserito nella classe "panel" nel file profile-box.css con il tag "radius"

Codice: Seleziona tutto

.panel {
    background-color: none;
    border: 3px solid #336699;
    padding: 10px;
    margin-top: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

eniac · Messaggio da **eniac** » 21/09/2018, 18:17

Grazie Micogian , ho intenzione di usare l'estensione Pages quindi tutta la pappardella che dovrei togliere non servirebbe più d'ufficio, attacco l'HTML nell'editor e via, il resto ci pensa lui a gestirlo, ho fatto le prove col custom per non installare l'estensione prima di sapere se riuscivo a fare quello che volevo ma pages è molto più comodo, la sto già tenendo sotto test in locale intanto che finisco l'html. Per il colore di sfondo aggiungo la linea che mi hai suggerito al custom.css sempre di alex75 cosi non ho problemi quando aggiorno il sistema, faccio prima a cambiare il fondo che starmi a scontornare tutte le immagini, i link sono diverse decine ;)
Spero di non dover disturbare ancora con queste che magari a voi possono sembrare delle fesserie ma io sono ancora lontano anni luce e quindi approfitto della vostra pazienza e gentilezza. :grazie:

phpBB-Italia.it

allineare delle immagini

Re: allineare delle immagini

Re: allineare delle immagini

Re: allineare delle immagini

Re: allineare delle immagini