当img标签放在里面时，标签不会浮动

Question

我的aside标记在我的section标记旁边浮动，如果没有img标记或只是文本内部，那就好了，但其他明智的我不能让浮动工作或内联块， 没有！我很难过。有谁知道我会如何解决这个问题？如果我向左或向右漂浮，它不会影响。它不会随着标签内的img移动

  section{
  border-style: double;
  border-color: yellow;
  float:left;
}
.news-feed{
  border-style: double;
  border-color: cyan;
  float: left;
}
img{
  border-style: double;
  border-color: white;
  float: left;
}
.summary{
  border-style: double;
  border-color: purple;
  float: left;
}
aside{
  opacity: 1;
  border-style: double;
  border-color: red;
  float: left;
}

  <section>
    <h2>Explore New Videos!</h2>
    <iframe width="700" height="397" src="LINK" frameborder="0" allowfullscreen >
    </iframe>
  </section>
  <aside>
    <div class = "news-feed">
        <img src="images/bg2.jpg" height="15%" width="5%">
        <div class = "summary">
          <p>This is text</p>
        </div>
    </div>
  </aside>

CSS for color mapp

Answer 1

您只需将temp = unique(c(t(x))) temp = temp[temp != ""] temp #[1] "r" "t" "x" "y" 值应用于元素width和section。使用百分比值将授予响应式布局：

＆＃13;

＆＃13;

aside

＆＃13;

 section{
  border-style: double;
  border-color: yellow;
  float:left;
  width: 70%;
}
.news-feed{
  border-style: double;
  border-color: cyan;
  float: left;
}
img{
  border-style: double;
  border-color: white;
  float: left;
}
.summary{
  border-style: double;
  border-color: purple;
  float: left;
}
aside{
  opacity: 1;
  border-style: double;
  border-color: red;
  float: left;
  width: 25%;
}

＆＃13;

＆＃13;

＆＃13;