Problem centering div with css

那年仲夏 提交于 2019-12-11 08:56:07

问题


I'm trying to center a div in my page but I have a very particular layout that doesn't let me center it with regular margin: auto properties. What I have is, basically this:

HTML:

<div id="container">
    <div id="sidebar">
        some text
    </div>
    </div id="content">
        some text
    </div>
</div>

CSS:

#container{
    margin: 0 auto;
    width: 900px;
}

#sidebar{
    float: left;
    width: 300px;
}

#content{
    float: left;
    width: 600px;
}

This centers my container with no problems but what I need is to center the "content" div relative to the width of the screen, here's the site that I'm working on so you can see it more clearly: http://dirtymind.jvsoftware.com/ and an image I made in an effort to better explain my problem: http://dirtymind.jvsoftware.com/img/csserror.png

Does anyone know how to accomplish this? Thanks all in advance.


回答1:


Increase the width of the container by the width of the sidebar, and add a right margin to the content block by the same amount.




回答2:


As far as I know that is not possible the way you want it to be. I would choose between the following options:

  1. adding margin-left, say .. 5% to container.
  2. constant left-margin


来源:https://stackoverflow.com/questions/3972857/problem-centering-div-with-css

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!