HTML CSS图片不会居中?

10 html css image

我试图将位于div内的图像居中,然后div位于另一个div内.不用担心,我会发布一些代码,这样你们都可以看到我在这里谈论的内容.

HTML:

<div id="container">

    <div id="featureimage"  style="width: 845px">
        <img src="Stylesheets/images/globkey.jpg" alt="" />
    </div>

</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

body {
    background-color: #383838;
    margin: 0; padding: 0;
    font-size: small;
    color: #383838;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    }
* html body {
    font-size: x-small; /* for IE5/Win */
    font-size: small; /* for other IE versions */
    }

img {
    border-style: none;
}



/* Conatiner */ 
#container {
    background-color: #fff;
    width: 845px;
    margin: 0 auto;
    overflow: hidden;
    }


#featureimage{
    width: 620px;
    padding: 0 0 0 15px;
    margin: 20px 0;

/* I have also tried without padding and no margin!*/
    }   

#featureimage img{
    margin-left:50%;
    margin-right:50%;
    width:360px;
    height:360px;
    }
Run Code Online (Sandbox Code Playgroud)

我这里的想法很新鲜!永远在这!

感谢您的任何帮助,

埃文

小智 31

图像是内联元素,为了使它们居中,您可以使用text-align: center;或设置它们display: block并进行设置margin: 0 auto;