0
I was able to make an image responsive, but the image will have to have a text on top and I can’t make the text responsive together. here is my code:
h1 {
font-family: sedgwick-ave;
font-size: 5vw;
position: absolute;
left: 900px;
bottom: 26vw;
}
.texx {
font-family: FjallaOne-Regular;
font-size: 1vw;
position: absolute;
bottom: 705px;
right: 340px;
text-align: justify;
}
.texxt {
font-family: FjallaOne-Regular;
font-size: 1vw;
position: absolute;
bottom: 600px;
right: 310px;
text-align: justify;
}
.foto {
max-width: 100%;
width: 100%;
position: absolute;
height: 90%;
}<body>
<div class="foto">
<img src="imagens/biggie.jpg">
</img>
<h1>SOBRE</br> NÓS</h1>
</div>
<div class="texx">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit,</br>
sed do eiusmod tempor incididunt ut labore et dolore magna </br>
aliqua. Ut enim ad minim veniam, quis nostrud exercitation</br>
</p>
</div>
<div class="texxt">
<p> ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute indolo</br>
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore</br>
eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,sunt </br>
in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</body>
But what do you mean by "responsive text"? How do you want this text to behave?
– hugocsl
When I decrease the guide, the image is in the same place, but the text that is not on it, it goes further down, I wanted that when decreasing the guide, the text continued in the same place.
– Fernanda
Fernanda you could edit your question and include an image of the Layout you want? No offense, it’s just that your code is not very cool, these 700px 900px values are not at all responsive and it’s them that are breaking your layout, put an image there that helps you answer, because it’s practically impossible to reuse your CSS, the ideal is to remake it from 0 already thinking about the adaptation to other screens
– hugocsl
Need to study better HTML. The tag
<img>does not close with</img>. :))– Sam
Just as
</br>there is no– Leandro Angelo