将div自动展开宽度向左而不是右侧 [英] Make a div auto expand width to the left instead of the right

问题描述

我在我的网站上有一个div，其中包含一个充当菜单的项目列表。我设置了CSS width：auto ，以便在菜单项太长时重新调整大小。目前，这将扩展到右侧，并将我的其余内容也推向右侧。

I have a div on my website which contains a list of items which acts as a menu. I have set the CSS width:auto so that it will re-size if a menu item is too long. At the moment though, this will expand to the right and "pushes" the rest of my content to the right as well.

这很难解释，所以作为一个例子如果您访问 http://redsquirrelsoftware.co.uk/ 并点击支持菜单项，您可以看到正在推送的内容。我想要发生的事情是让div扩展到菜单左侧的空白处。

This is hard to explain so as an example if you go to http://redsquirrelsoftware.co.uk/ and click on the Support menu item, you can see the content being pushed across. What I want to happen is for the div to expand into the white space to the left of the menu.

目前我为div使用的CSS是：

The CSS I have for the div at the moment is:

.sidebar1 {
    float: left;
    width: auto;
    min-width: 25%;
    max-width: 29%;
    margin-top: 65px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 12px;
}

有没有办法让它以另一种方式展开？
在此先感谢。

Is there any way for it to expand the other way? Thanks in advance.

推荐答案

这个想法需要测试，但它至少在Chrome中有效：

This idea needs testing, but it works in Chrome at least:

• 更改 .content 和 .sidebar1 至 float：right 而不是 float：left 。


• ，在 .content 之后移动 .sidebar1 。

• Change .content and .sidebar1 to float: right instead of float: left.
• In the HTML, move .sidebar1 after .content.

这篇关于将div自动展开宽度向左而不是右侧的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！