Я пытаюсь создать список блоков div

Question

Я пытаюсь создать список блоков div, однако, когда я их размещаю, второе изображение не заподлицо с левой стороной контейнера.

Я хотел бы добавить пространство между двумя div, используя границу, чтобы создать линию между новостными статьями. Если вы знаете, как сделать эту работу, оставьте комментарий. Страница просто ничего не делает. Он не принимает никаких команд стиля вообще.

У меня не было никакого другого кода стиля, потому что это единственный рабочий код стиля. Честно говоря, я мог бы удалить стиль wrap2, и ничего не изменилось бы.

img.wrap { 
 
    float: left; 
 
    border: 1px solid black; 
 
    margin: 10px 10px 20px; 
 
} 
 
img.wrap2 { 
 
    float: left; 
 
    border: 1px solid black; 
 
    margin: 10px; 
 
}

<div id="invisiblebox"> 
 
    <div id="nvidiablog1"> 
 
    <a href="https://blogs.nvidia.com/blog/2016/11/26/virtual-reality-flight-simluation/"> 
 
     <img src="images/virtual.jpg" class="wrap" height="100" width="100"> 
 
    </a> 
 
    <p>According to a recent article posted by NVIDIA, Mass Virtual has been a long standing partner of the United States Navy. Mass Virtual's specialty is to provide the Navy with virtual reality training simulators, and boy did they deliver. Mass Virtual's 
 
     newest training simulator which, to quote the article written by John Chaney <i>"is beyond visual range"</i>. To read more about this article please click the image to be redirected.</p> 
 
    </div> 
 
    <div id="nvidiablog2"> 
 
    <a href="https://blogs.nvidia.com/blog/2016/11/28/titan-supercomputer-ethanol/"> 
 
     <img src="images/titan.jpg" class="wrap2" height="100" width="100"> 
 
    </a> 
 
    <p></p> 
 
    </div> 
 
</div>

Answer 1

.container {дисплей: сгибать;}

И удалить поплавок