html - 在 元素中使用 float 和 clear

Question

我试图在一个元素的左侧和右侧分别使用和使用两个元素，但事情并没有像我期望的那样发展。请参阅下面的 jsfiddle 链接...

https://jsfiddle.net/vx7tjbkf/

aside {
    margin: 0;
    padding: 0;
    width: 25%;
    background-color: aqua;
}

#leftaside {float: left;}
#rightaside {float: right;}

article {float: left;
    margin: 0;
    padding: 0;
    width: 50%;
    background-color: lightgreen;

}

Answer 1

你的样式表有一个清晰的属性放在一边

    section,
    aside,
    article,
    footer {
        clear: both;
    }

删除它，它将起作用，或者使用更具体的选择器将 clear 覆盖为 none; https://jsfiddle.net/vx7tjbkf/1/

css 清除属性:https://www.w3schools.com/cssref/pr_class_clear.asp
“指定元素的左侧或右侧不允许有 float 元素”