Html 嵌套div但不起作用？_Html_Css_Nested

Html 嵌套div但不起作用？

html css

Html 嵌套div但不起作用？,html,css,nested,Html,Css,Nested,我的div应该包含两个以上的div（在左边和右边），但在右边不起作用。我应该如何将它与左边的对齐 #左{ 位置：绝对位置；最高：76%；左：20%；颜色：黑色；边框：2件纯黑；边界半径：15px 15px；左侧填充：15px；右侧填充：15px；字号：1em；文本对齐：居中；背景图片：url（“pink.jpg”）；高度：1000px；宽度：800px；背景尺寸：900px 1000px；边框：1px纯黑；背景重复：无重复；盒影：7px 7px 18px白色；

我的div应该包含两个以上的div（在左边和右边），但在右边不起作用。我应该如何将它与左边的对齐

#左{
位置：绝对位置；
最高：76%；
左：20%；
颜色：黑色；
边框：2件纯黑；
边界半径：15px 15px；
左侧填充：15px；
右侧填充：15px；
字号：1em；
文本对齐：居中；
背景图片：url（“pink.jpg”）；
高度：1000px；
宽度：800px；
背景尺寸：900px 1000px；
边框：1px纯黑；
背景重复：无重复；
盒影：7px 7px 18px白色；
}
#在左边{
最高：87%；
左：22%；
颜色：黑色；
字号：1.5em；
文本对齐：左对齐；
高度：650px；
宽度：400px；
字体系列：AR CENA；
右边框：1px纯白；
}
#正确的{
最高：87%；
左：50%；
颜色：黑色；
字号：1.5em；
文本对齐：右对齐；
高度：650px；
宽度：400px；
字体系列：AR CENA；
}



业余爱好

自行车运动🚵
我每隔一天骑一次自行车，独自一人，有时和朋友们一起。我真的很享受孤独和空气吹到我头发上的方式，我可以自豪地说骑自行车是我的放松技巧。
📖；阅读书籍和短篇小说📖
我通常把时间花在室内，阅读对我缓解无聊有很大帮助。我喜欢恐怖片，因为它给了我刺激和兴奋的感觉。Reddit：
📽；看电影🎥
🎧；听音乐🎶
玩电子游戏🎮
🍔；吃🍳

兴趣：

使用CSS的float属性。谢谢

float : right;

使用CSS的float属性。谢谢

float : right;

使用

flexbox

将帮助您轻松实现解决方案。检查代码段

div{
边框：1px实心#ddd；
填充：10px；
}
.集装箱{
显示器：flex；
}
.在左边，.在右边{
柔性生长：1；
}


左边
赖特

使用

flexbox

将帮助您轻松实现解决方案。检查代码段

div{
边框：1px实心#ddd；
填充：10px；
}
.集装箱{
显示器：flex；
}
.在左边，.在右边{
柔性生长：1；
}


左边
赖特

有很多选项可以让你实现你在这里想要的，但在我开始列出它们之前，有一条关于HTML和CSS的快速建议：“你尝试的越多，就越困难，试着寻找最简单的解决方案。”

考虑到这一点，让我们来寻找一些简单的解决方案，让你实现你想要的

选项1：浮动是一个出色的属性，它允许您对齐父容器中的

div

元素。它可以非常好地工作，但是您需要小心，因为（正如MDN文档所述）：

…该元素取自网页的正常流

这意味着父容器的大小将不再能够容纳

div

。要解决此问题，可以在父元素的

：：after

伪元素上使用属性，这将强制其正确调整大小

.parent{
背景：红色；
颜色：白色；
}
.parent：：之后{
内容：“；
显示：块；
明确：两者皆有；
}
.左{
浮动：左；
背景：蓝色；
填充：10px；
}
.对{
浮动：对；
背景：绿色；
填充：10px；
}


我的第一个div
我的第二个div