Good I have this following code:
@media screen and (max-width:100px){
#yo {
border:1px solid green;
}
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" integrity="sha384-PsH8R72JQ3SOdhVi3uxftmaW6Vc51MKb0q5P2rRUpPvrszuE4W1povHYgTpBfshb" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<section>
<div class="container">
<h4 >titulo</h4>
<h5 >My name is</h5>
<h6>My profesional</h6>
<hr style="border-bottom:1px solid red; width: 10%;">
<img id="yo" class="img-fluid" src="https://scontent.fhmo1-1.fna.fbcdn.net/v/t1.0-9/23131644_154606561942762_3784176640472935786_n.jpg?oh=5e8ff9723d95c67188f3eb81ace919e5&oe=5AD32247" width="200" height="200">
<p style=" float:right;width:70%;">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
</section>as you see I use an @media to apply a green border (the id is an img, I understand that it is not recommended to use id in css but it is only a preuba)
And the framework I use is materialize, in the code are all the resources of the project.
The tutorial to do the media found in mzo dev: Media - tutorial
Does anyone know where I have the error?