Aliniere text cu CSS

#1
alex05ok

Posted 15 June 2019 - 07:16

Member

Grup: Members
Posts: 376
Înscris: 08.11.2007

Buna ziua!
Cum aliniez textul ca sa fie in partea de sus, ca in imagine? Multumesc!

<p>1. <img src="image_1.png" ></p>
<p>2. <img src="image_2.png" ></p>

[ https://i.ibb.co/dbQfYfQ/Untitled2.png - Pentru incarcare in pagina (embed) Click aici ]

Back to top

#2
sags

Posted 15 June 2019 - 07:33

Senior Member

Grup: Senior Members
Posts: 9,951
Înscris: 24.04.2013

vertical-aling:top sau vertical-aling:text-top (pe elementul <img>)

Back to top

#3
alex05ok

Posted 15 June 2019 - 09:37

Member

Grup: Members
Posts: 376
Înscris: 08.11.2007

Daca pun numarul in span merge:
HTML:

<p><span>1. </span><img src="image_1.png" ></p>

CSS:

span	{vertical-align: top;}

Oare merge si fara span prin alta metoda?

Edited by alex05ok, 15 June 2019 - 09:39.

Back to top

#4
Mizu

Posted 15 June 2019 - 11:06

moroșan

Grup: Senior Members
Posts: 18,822
Înscris: 10.12.2006

Vezi containerul in care sunt textul si imaginea, si da-i lui .container {vertical-align: top;}
Vezi daca iti da bine asa.

Back to top

#5
alex05ok

Posted 15 June 2019 - 16:00

Member

Grup: Members
Posts: 376
Înscris: 08.11.2007

Textul si imaginea sunt intr-un paragraf. Am pus paragrafele intr-un div si le-am dat {vertical-align: top;} dar nu merge.

https://jsfiddle.net/a7n8v4zh/1/

Back to top

#6
whiteboy

Posted 15 June 2019 - 16:09

Member

Grup: Members
Posts: 927
Înscris: 18.12.2007

HTML:

<div id="wrapper">
<div>
<span>1.</span>
<img src="https://i.ibb.co/yncwmFG/1.png" >
</div>
<div>
<span>2.</span>
<img src="https://i.ibb.co/0mngVTf/2.png" >
</div>
</div>

CSS:

span {font-size:30px; vertical-align:top;}

Daca vrei sa folosesti p in loc de span, atunci mai trebuie sa adaugi la css display: inline;

Edited by whiteboy, 15 June 2019 - 16:11.

Back to top

Anunturi

Neurochirurgie minim invazivă

"Primum non nocere" este ideea ce a deschis drumul medicinei spre minim invaziv.

Avansul tehnologic extraordinar din ultimele decenii a permis dezvoltarea tuturor domeniilor medicinei. Microscopul operator, neuronavigația, tehnicile anestezice avansate permit intervenții chirurgicale tot mai precise, tot mai sigure. Neurochirurgia minim invazivă, sau prin "gaura cheii", oferă pacienților posibilitatea de a se opera cu riscuri minime, fie ele neurologice, infecțioase, medicale sau estetice.

www.neurohope.ro

Aliniere text cu CSS

#1 alex05ok Posted 15 June 2019 - 07:16

#2 sags Posted 15 June 2019 - 07:33

#3 alex05ok Posted 15 June 2019 - 09:37

#4 Mizu Posted 15 June 2019 - 11:06

#5 alex05ok Posted 15 June 2019 - 16:00

#6 whiteboy Posted 15 June 2019 - 16:09

Anunturi

▶ 0 user(s) are reading this topic

Sign In

#1
alex05ok

Posted 15 June 2019 - 07:16

#2
sags

Posted 15 June 2019 - 07:33

#3
alex05ok

Posted 15 June 2019 - 09:37

#4
Mizu

Posted 15 June 2019 - 11:06

#5
alex05ok

Posted 15 June 2019 - 16:00

#6
whiteboy

Posted 15 June 2019 - 16:09