+ 1
How to place a image center
I try to centering a image but it dont i am using html and css
9 Réponses
+ 4
Can you share your code? If you're trying to center it both vertically and horizontally then:
img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
only vertical:
img {
position: absolute;
left: 50%;
transform: translate(-50%);
}
only horizontal:
img {
position: absolute;
top: 50%;
transform: translate(0, -50%);
}
+ 1
<img> is an inline element, therefore, you should place it inside a paragraph aligned to the center if you want the picture to be aligned to the center, like this:
<p align="center">
<img src="example">
</p>
You can of course do that with CSS as well.
+ 1
Art Bucket no, that's wrong.
0
img {
display: block;
margin: auto;
}
0
Please link your attempt.
0
Use center tag to center an image.
0
use the <img align=center>
0
thanks for showing my mistake
0
Karula Korona hi,
It seems there is an easy way to do that:
On the container element-->
.container{
display:grid;
place-items:center;
}
I didn't test if it works on inline element, if no, you can try to add
img{
display:inline-block;
}
The tips is given at 2mn in that video with others usefull ones after:
https://youtu.be/qm0IfG1GyZU