Image is not centering

Question

Image is not centering

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I have tried in several ways, but the image is not centralizing. Here is the code to better understand the problem:

.logo2 {
     color: pink;
     position: absolute;
     margin: 0 auto !important;
     float: none !important;
    
     z-index: 1001;
     border-radius: 100%;
     text-align: center;
}

<div class = "container">
    <div class = "row">    
        <div class="col-md-12 logo2">
            <a href="#">
                <img src="https://i.stack.imgur.com/Go65r.png"class="img-responsive"/> 
            </a>
        </div>
    </div>
</div>

Here is the image:

html css bootstrap-3

asked by anonymous 28.07.2017 / 04:37

2 answers

CSS Gradient Radial Site does not display CSS after Publication

score 0 · Answer 1

If the .logo2 class is an attempt to center the image, you can delete it.

Add in your css the following style for the tag <img>

img{
 width:100%;
}

Note: If this image is an attempt to make a menu, you are most likely going the hard way.

score 0 · Answer 2

Does the header really have to be in position: absolute?

Apparently you can leave the background in a div and divide the header into 3 columns by placing the first menu in column 1, the centered image in column 2 and the third menu in column 3.

Or you can go beyond and put everything into an ul using the: nth-child.