I'm looking to align the logo and the navigation bar links on the same line. The logo should be displayed alone when viewed on a mobile device.
Here's how it currently appears: Currently shown on two lines.
This is the HTML code for it:
<!-- header Area Start-->
<div class="header-area">
<div class="container">
<div class="row">
<div class="col-lg-2 col-md-3 col-12">
<div class="logo">
<a href="index-2.html">
<img src="assets/img/logo.png" alt="">
</a>
</div>
</div>
<div class="col-lg-10 text-right col-md-9 col-12">
<div class="responsive_menu"></div>
<div class="mainmenu-area">
<ul id="nav">
<li><a href="index-2.html">Home <i class="fa fa-angle-down"></i></a>
<ul class = "drop-menu">
<li><a href="index-2.html">Rocket Home</a> </li>
<li><a href="Gradient.html">Gradient Home</a> </li>
</ul>
</li>
<li><a href="domain.html">Domain</a></li>
<li><a href="hosting.html">Hosting <i class="fa fa-angle-down"></i></a>
<ul class="drop-menu">
<li><a href="hosting.html">Hosting</a> </li>
<li><a href="Team.html">Team</a> </li>
<li><a href="about.html">About us</a></li>
<li><a href="Testimonial.html">Testimonial</a></li>
<li><a href="faq.html">FAQ</a></li>
</ul>
</li>
<li><a href="#">Pages <i class="fa fa-angle-down"></i></a>
<ul class="drop-menu">
<li><a href="Team.html">Team</a> </li>
<li><a href="about.html">About us</a></li>
<li><a href="Testimonial.html">Testimonial</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="service.html">Service</a></li>
<li><a href="blog-details.html">Blog Details</a></li>
<li><a href="404.html">404 Page</a></li>
<li><a href="coming-soon.html">Coming Soon</a></li>
</ul>
</li>
<li><a href="blog.html">Blog</a></li>
<li><a href="support.html">Support</a></li>
</ul>
</div>
<div class="search">
<span class="search-trigger"><i class="fa fa-search"></i></span>
<div class = "search-box">
<form action="#">
<input type="text" name="s" placeholder="Search..">
<div class="submit-btn">
<input type="submit" value="Go">
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- header Area end-->
Could you provide any recommendations on how I can accomplish this one-line layout?