宽度不好，部分
我对部分和解决方案有问题。 当宽度较小而较小的部分何时陷入困境，例如。部分的部分。 我不知道我还需要写些什么才能阻止这个问题。 我还能写些什么来修复部分而不漏洞或其他内容。 有屏幕截图可以更好地视图： https://i.sstatic.net/at7p3.png
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/navbar.css">
<title>Document</title>
</head>
<body>
<section class="home">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</p>
</section>
<section class="about">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</section>
<section class="contact">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</section>
</body>
</html>
* {
margin: 0;
padding: 0;
}
section {
height: 100vh;
width: 100%;
}
.home {
background-color: rebeccapurple;
}
.about {
background-color: aquamarine;
}
.contact {
background-color: brown;
}
I have problem with sections and resolution.
When is width smaller and smaller sections are bugging together, ex. section home to section about.
I dont know what more i need to write to stop this problem.
What more i can write to fix sections without bugging or something.
There is screenshot for better view: https://i.sstatic.net/At7P3.png
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/navbar.css">
<title>Document</title>
</head>
<body>
<section class="home">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</p>
</section>
<section class="about">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</section>
<section class="contact">
<h1>Test</h1>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis beatae facilis est, quod veniam amet sunt assumenda repudiandae, numquam error tenetur. Ducimus sit omnis recusandae similique ipsa? Eligendi, nulla tempora!
</section>
</body>
</html>
* {
margin: 0;
padding: 0;
}
section {
height: 100vh;
width: 100%;
}
.home {
background-color: rebeccapurple;
}
.about {
background-color: aquamarine;
}
.contact {
background-color: brown;
}
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
在部分中，更改
100VH带有100％In section change
100vhwith100%