div#banner>img {
float: left;
background-color: #4b634b;
height: 265px;
width: 80%;
}
ul {
float: left;
background-color: #769976;
width: 162px;
}<body>
<div id="wrapper">
<header>
<nav>
<ul>
<li><a href="1.html" class="active">one</a></li>
<li><a href="2.html">two</a></li>
<li><a href="3.html">three</a></li>
</ul>
</nav>
<div id="banner">
<img src="pic.jpg">
</div>
</header>
<!--...rest of body and wrapper...-->
</div>
</body>Hello, I searched extensively but have not found a satisfactory solution yet. The issue is that I am trying to position the navigation at the top left corner and attach the banner to its right border within the wrapper. While the CSS works in fullscreen mode, it introduces a line break between the two elements at a certain point. How can I prevent this from happening? Thank you for your assistance.