PDA

View Full Version : learning - cant figure center img



bronxsystem
02-17-2018, 06:58 AM
Hey all
I am new to bootstrap and and figure this out. I created a bootstrap website following a guide. I am trying to center an image on small screens. I have a row with 2 columns both taking up half the row col-md-6. When it gets to small screens the image is to close to the left.

309



<div class="row">
<div class="col-md-6">
<img src="../img/explore.jpeg" class="img-fluid mb-3" style="max-width: 80%; border-radius:5px;" />
</div>

I have tried adding the following classes to the img
class="d-flex flex-row justify-content-center"
class="d-flex flex-row justify-content-around"

also tried text-align-center on the div holding the image.

I know i can use CSS margin: 0 auto; but isnt there an easier way. mx-auto didnt work.

EDIT:

read the documentation so its mx-auto but how do i make it only for small screens.

can i do something like d-md-inline? that would remove the mx-auto right

DanielLee5
06-23-2018, 02:09 PM
Interesting!