html距离屏幕左侧,html – 3 div根据屏幕大小更改位置

我想通常在页面中显示3个div,如下所示

--------------

| | |

| 1 | |

| | 2 |

|-----| |

| | |

| 3 | |

| | |

--------------

所以HTML会是这样的

EDIT: I do think there is a better solution but to keep 1 and 3 on the

left one after the other first thing you may do is placing them inside

another div.

I do believe that doing so it will be impossible to solve the resize

by the use of media queries only.

Is there a way to achieve the same visual result without the external container div?

@RenderSection("leftBefore", required: false)

@RenderSection("leftAfter", required: false)

@RenderBody()

我的目标是让左侧菜单具有固定宽度,右侧则使用剩余空间.如果屏幕尺寸减小,则div应该移动以便具有类似下面的内容,可能全部居中.

有什么建议？

---------

| |

| 1 |

| |

|-------|

| |

| 2 |

| |

|-------|

| |

| 3 |

| |

---------