0
I tried several ways and still could not, I’m kind of new with CSS, I wanted this "Name" to be at the time that matches the middle of the image next.
3 answers
1
Usually you will use the display: table-cell in the box where you want to style the vertical position of the text and then use the vertical-align: middle, but then you need to set a height for that box too.
However, perhaps with display: flex be much simpler and less ugly. I, if I were you, would study how he behaves. Today I am too old to learn this voice... = P
1
I will leave a code that you will position your text where you want, changing the values of
top: 20px; left: 120px; in css
.image {
position: relative;
width: 100%; /* para IE 6 */
}
.h2 {
position: absolute;
top: 20px;
left: 120px;
width: 100%;
}
.h2 span {
color: blue;
font: bold 14px Helvetica, Sans-Serif;
letter-spacing: -1px;
}
}<div class="image">
<img src="https://i.stack.imgur.com/vNpu1.png" alt="" />
<h2 class="h2"><span>La Treta<span class='spacer'></span></h2>
</div>0
Just apply to the vertical-align image: Middle.
By default, the images are positioned at the bottom of the line. See this example as simple:
Html:
<div>
<img class="middle" src="http://placehold.it/100x50" alt=""> Teste
</div>
Css:
.middle {
vertical-align: middle;
}
Example link: https://jsfiddle.net/rq3jresz/
Another very useful link and this site you answer the questions and it gives you the final code of how to center the content. http://howtocenterincss.com/
Browser other questions tagged css bootstrap
You are not signed in. Login or sign up in order to post.
Could you post some example code? The most appropriate way to solve your problem may depend on how your HTML and CSS are now.
– Oralista de Sistemas
A line-height can help you.
– Rafael Weber
publish the code you are using please.
– RFL