html设置图片没有右边距,css – Div为页面宽度的100％,减去右边固定div的宽度(但没有设置边距右)...

我把头发拉了出来因为我无法解决这个问题.我正在开发一个wiki.典型页面右侧有一个侧栏,宽度固定.此侧边栏的左侧是文本,div,表格等(页面内容).基本上,我希望一切都在全宽 – 这意味着如果它在侧边栏旁边,它应该是全宽减去侧边栏的长度.如果它不在侧边栏旁边,则应该是页面的整个宽度.像这样：

_______________________________

| ___ |

| text text text text te- | | |

| xt text text text text. | S | |

| ______________________ | B | |

| | | | | |

| | table | |___| |

| | or | |

| | div | |

| |_____________________| |

| |

| more text text text text tex- |

| t text text text text text t- |

| ext text text text text text |

| ____________________________ |

| | another table | |

| | or | |

| | div | |

| |___________________________| |

|_______________________________|

在文本的情况下,它完全包围侧边栏.如果我有一个超长句子,它一直到侧边栏的左边,然后打破一个新的行.如果我有一个超长段落,所有文本都会在侧边栏旁边突然出现,并且也会在它下面.

但是,我遇到的问题是当我想在侧边栏的左侧放置div时.设置为100％时,div不会考虑侧边栏的宽度并扩展到页面的整个宽度,从而与侧边栏重叠.通常我只是将div设置为侧边栏宽度的右边距.但是,出于我的目的,这是不可行的,因为在不同的屏幕分辨率下,div可能在侧边栏下面的页面上较低,因此div的右边会有一个空白的间隙(加上它只是更容易编码,以解决这个问题,所以页面的div知道它们应该有多宽.)例如,在我上面的文字图片中,如果页面较薄,因为它的屏幕分辨率较低,则第一个框可能位于侧边栏下方.使用侧边栏的边距右侧,这意味着框的右侧会有很大的间隙,并且它不会是页面的整个宽度.

这是我正在使用的代码.

float: right;

width: 250px;

height: 200px;

border: 1px solid red;

}

#la {

border: 1px solid green;

width: 100%;

}

Sidebar with fixed width

The sun is a star.

It's yellow.

It's very hot.

This div is next to the sidebar and should bump up right next to its left side, as in, 100% of the page minus the width of the sidebar. It should not overlap the sidebar. This is not something that can just be done automatically with margin-right using the width of the sidebar because it might not actually be next to the sidebar on certain screen resolutions.

The sun is a star.

It's yellow.

It's very hot.

This div is NOT next to the sidebar on most screen resolutions - it is under it where there is nothing to the right of it, so it should be the full width of the page.

我希望有一种方法可以做到这一点,如果东西旁边的东西,如div中的表,它将在页面的最大宽度减去侧边栏的宽度.如果它不在侧边栏旁边,那么它就是页面的整个宽度.我想我只是希望其他所有内容都像文本一样 – 它会直接转到它右侧的任何内容(如果侧边栏不在那里,可以是侧边栏,如果侧边栏不在那里,可以是页面右侧).

先感谢您！ 🙂