Aiuto su CSS

shazarak

@justov12 HTML -> riga 9 , 10 e 11, togli i tre <br>

justov12

@andrea-paolelli fatte le modifiche, ma non sono ancora centrate le icone, è tutto spostato sulla destra, per crearle responsive non ho idea di cosa fare, potete darmi qualche info come se parlaste ad un neofita totale?

justov12

@andrea-paolelli a prescindere dal mobile non sono centrate nemmeno adesso che sono da pc fisso

justov12

@andrea-paolelli non è per niente allineata, allego questa così capite meglio cosa voglio dire

https://i.ibb.co/0fgLQPn/Senza-titolo-2.png

shazarak

@justov12
.wrapper{
display: flex;
justify-content:space-between;

}
togli margin: 0 20px; da .wrapper .icon

riguardo al mobile dipende sempre da come vuoi che vengano visualizzate le icone (a prescindere dal fatto che poi dovrai penso sistemare i tooltip)

con questo
.wrapper{
display: flex;
justify-content:space-between;
flex-flow: row wrap;
}
mantieni le icone in riga e su mobile stretto te le manda a capo su nuova riga ecc.

altrimenti vai di media query e gli dici che fino a X width deve mantenere un direction cloumn ( invece che row) e te le mette tutte una sotto l'altra

altrimenti ripeto dipende da come le vuoi, puoi anche pensare di rendere le icone piu piccole e farle stare tutte in una riga, oppure farle andare su due colonne e piu righe ecc

Comunque fai tutto con flexbox e media query

justov12

@shazarak grazie mille! ora va decisamente meglio, ho tolto le icone non necessarie ed ora va benissimo. grazie mille!, un altra piccola domanda, come posso impostare la larghezza del box di testo? forse è un pochino stretto, ma con width non riesco.

shazarak

@justov12 a vedere cosi come è stato creato html la larghezza del box che contiene il testo è dato da questo: <div class="col-lg-6 offset-lg-3"> quelli sono impostazioni di griglia da bootstrap 4

https://getbootstrap.com/docs/4.0/layout/grid/

quindi se ci sono 12 colonne nella griglia, tu stai usando un 6 colonne con un offset di 3 colonne, che significa che lo hai centrato, diciamo cosi

se vuoi il "box" piu largo lavori sull'aumentare le colonne e diminuire l'offset... ma se usi 7 colonne poi non te lo centra piu e quin entra in gioco il justify-content guarda le info di boootstrap e trovi la soluzione per te

tipo
HTML riga 3-4 cambia in
<div class="row justify-content-center">
<div class="col-lg-7 ">

CSS riga 97-100 rimuovi
.testo{
width: 650px;

}