Тонкая белая линия на правой стороне страницы - PullRequest
Новая
       29

Тонкая белая линия на правой стороне страницы

0 голосов
/ 07 сентября 2018

Я не могу понять, почему у меня есть тонкое поле (или отступ) с правой стороны моей страницы. Вы можете видеть это на правой стороне зеленого изображения. Веб-страница расположена по адресу http://www.puremisthealth.com.

Я вижу проблему в нескольких браузерах. Я подозреваю, что это незначительная проблема, но я не могу найти виновника. Когда я использую Inspect в Chrome, похоже, что он влияет на все тело.

См. Код ниже. 

<html>

<head>

<title>PureMist</title>

<link rel="stylesheet" href="styles.css">

</head>

<body>


<div id="logo">

    <a href="http://www.puremisthealth.com">
        <img src="http://www.puremisthealth.com/images/logo.jpg">
    </a>

</div>

<div class="navwrapper">

    <div class="nav">

        <div class="nav-item-active"><a href="http://www.puremisthealth.com">HOME</a></div>

        <div class="nav-item"><a href="/about">ABOUT</a></div>

        <div class="nav-item"><a href="/how">HOW IT WORKS</a></div>

        <div class="nav-item"><a href="/faq">FAQ</a></div>

        <div class="nav-item"><a href="/contact">CONTACT</a></div>

    </div>

</div>

<div id="touchless">



</div>



</body>

</html>

CSS: 

html,body
{
width: 100%;
margin: 0;
padding: 0;
overflow-x: hidden; 
}


@font-face {
 font-family: MeeraInimai;
 src: url('MeeraInimai-Regular.ttf'); 
}


a {

text-decoration: none;
color: #949695;

}


#logo {

margin-top: 50px;
text-align: center;
}


.navwrapper {

width: 100%;
margin: 35px 0 35px 0;

}


.nav {
    width: 100%;
text-align: center;
}


.nav-item {

font-family: 'MeeraInimai', Arial, sans-serif;
margin: 0 20px 0 20px;
display: inline-block;
    color: #949695;
    font-weight: bold;
    font-size: 1.1em;
    text-align: center;
letter-spacing: 4px;
}

.nav-item:hover {

font-family: 'MeeraInimai', Arial, sans-serif;
margin: 0 20px 0 20px;
display: inline-block;
    color: #949695;
    font-weight: bold;
    font-size: 1.1em;
    text-align: center;
letter-spacing: 4px;
border-bottom: 4px solid #bcd762;
line-height: 2;

}

.nav-item-active {

font-family: 'MeeraInimai', Arial, sans-serif;
margin: 0 20px 0 20px;
display: inline-block;
    color: #949695;
    font-weight: bold;
    font-size: 1.1em;
    text-align: center;
letter-spacing: 4px;
border-bottom: 4px solid #bcd762;
line-height: 2;
}

#touchless {

background-image: url("/images/touchless.jpg");
background-size: 100%;
background-repeat: no-repeat;
margin: 40px 0 50px 0;
height: 450px;

}
...