当屏幕尺寸低于某个点时，我目前无法让我的徽标和移动下拉菜单保持在同一行。我尝试过媒体查询来缩小图像，但仍然遇到同样的问题。我在这里阅读了另一篇文章，使用 css 设置导航栏品牌背景，而不是将其嵌入 img 标签，但是当我尝试时，图像不会显示。
这是我的 html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../../../favicon.ico">
<title>Pristine Clean Outs | Home</title>
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- Carousel style-->
<link href="css/carousel.css" rel="stylesheet">
<!--Custom Styles-->
<link rel="stylesheet" href="css/style.css">
</head>
<body id="top">
<header>
<div class="container-fluid">
<nav class="navbar navbar-expand-md navbar-light fixed-top bg-white">
<a class="navbar-brand" href="index.html"><img class="img-fluid logo" src="img/pristinelogo.png" alt=""></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> …