come allineare un icona

Il Capitano Hook · 24 Mar 2015

sto cercando di adattare un esempio postatomi alla mia idea ( piu che altro vado a tentativi )
ma ho un problema ho inserito un titolo (h4) che dovrebbe andare a sinistra del div e un icona ( di font awesome fa-leaf ) che dovrebbe andare a destra nel div ( poi dovrebbe ripetersi su ogni div ) , sulla stessa linea del titolo , ho provato diverse soluzioni ma o mi mettono l'icona sotto l'h4 o me la mettono al di fuori del div a destra ,come devo fare ?

criric · 24 Mar 2015

Ciao devi applicare la proprietà float

WottaFacca · 25 Mar 2015

Per poter allineare un testo con un'immagine non ti basta usare il float, perchè il testo prendedelle dimensioni "proprie".

Io ti consiglio di usare il tag

HTML:

<p> </p>

per i testi e gli assegni una classe o un ID così da poterlo spostare a tuo piacimento con margin-(top-left-right-bottom)

WottaFacca

Max 1 · 26 Mar 2015

Devi farci vedere i tentativi che hai fatto altrimenti non possiamo capire il perchè del problema.
Se hai usato il float può essere che la pagina non è abbastanza larga per contenere tutto, ma è solo un'ipotesi visto che come detto non si sa cosa hai fatto

zorro · 28 Mar 2015

Quindi, se ho capito bene, le vorresti mettere a destra e a sinistra, ma all'nterno del DIV.
Secondo me, per poter usare FLOAT dovresti suddividere il div principale un 2 sottodiv: uno a detra (float: right)
e uno a sinistra (flòoat: left) o provare con una tabella

Zorro

Il Capitano Hook · 29 Mar 2015

scusate la mia assenza !

@criric ci sto provando , ma non mi allinea un benemato ciufolo o meglio lo allinea come dice lui ( vedi il link )!

@wottafacca , non posso usare i tag <p> perche sono icone o titolo quindi hanno il loro tag <i> e <h4>

@max 1 , questo è uno dei miei tentativi ( spero il link esterno sia tollerato ) dovrebbero trovarsi tutti e 2 sulla stessa linea uno a destra e l'altro a sinistra , invece !

@zorro, ho provato con i div ma non ci sono riuscito domani a mente lucida ci riprovo , usare le tabelle lo avevo scartato per non complicarmi la vita troppo !

zorro · 29 Mar 2015

E' questo (qualcosa di simile) quello che vuoi realizzare ??

Se si, ti posto il codice (nn c'è nemmeno bisogno di usare le tabelle)

HTML:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
#maindiv {
	width:900px;
	height:300px;
	background-color:#9FF;
}	
#icona {
	width:120px;
	height:150px;
	background-image:url(facelogo.png);
	background-repeat:no-repeat;	
	float:left;
}	
#scritta {
	width:200px;
	height:50px;
	line-height:50px;
	float:right;
}	
</style>
</head>

<body>
<div id="maindiv ">
	<div id="icona">
	</div>
	<div id="scritta">
		<h1>SCRITTA</h1>
	</div>
</div>
</body>
</html>

Cerca

Cerca

come allineare un icona

Il Capitano Hook

Nuovo Utente

criric

Super Moderatore

WottaFacca

Utente Attivo

Max 1

Super Moderatore

zorro

Utente Attivo

Il Capitano Hook

Nuovo Utente

zorro

Utente Attivo

Discussioni simili