网页右侧的大量空白
网页右侧的大量空白
提问于 2018-12-22 20:50:00
嘿，伙计们，我以前遇到过这个问题，并在这个网站上发布过。我被推荐溢出-x:隐藏以解决问题。这在很大程度上是可行的，但是我注意到，即使有了这个属性，仍然有一个10‘s的滚动。现在，在这个项目的大部分情况下，它是最近才开始发生的，所以我取消了这个属性，这样我就可以用我的开发工具查看所有的空白，但是找不到任何突出在右边的东西。为什么会发生这种情况？感谢你的帮助：)
因为某些原因，我不得不发布一些代码来发布这个链接，但是它只是html点击我所有代码的链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>El Metate | Mexican Food</title>
<link rel="stylesheet" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Cedarville+Cursive|Josefin+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Bree+Serif|Kumar+One+Outline|Teko" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Diplomata+SC|Ewert|Sarina|Smokum" rel="stylesheet">
<script src="https://unpkg.com/scrollreveal"></script>
</head>
<body>
<section id="header">
<div class="container">
<div class="nav-btn">
<div class="btn-1"></div>
<div class="btn-2"></div>
<div class="btn-3"></div>
</div>
<div class="side-menu">
<ul>
<i class="fas fa-times"></i>
<li><a href="#header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#menu">Menu</a></li>
<li><a href="#hours">Hours</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#news">News</a></li>
</ul>
</div>
<p><span class="auth">Authentic</span><span class="mexi">Mexican</span><span class="food">Food</span></p>
<img src="img/LogoMakr_Oso9xi.png" alt="">
</div>
</section>
<section id="about">
<div class="container">
<div class="line"></div>
<h1>About us</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Facilis, quis, adipisci! Unde natus quas officiis, earum commodi! Voluptate in modi alias quisquam maiores sunt fugit reprehenderit odio rem obcaecati libero repellat saepe quidem quibusdam impedit labore error velit, possimus necessitatibus. Optio ullam, officiis, sit ipsa fugiat animi voluptas labore. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quia, et.</p>
<div class="image-slider">
<i class="fas fa-caret-down left"></i>
<i class="fas fa-caret-down right"></i>
</div>
</div>
</section>
<section id="menu">
<div class="container">
<div class="left-border">
<div class="shape-wrap">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 385px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 770px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1155px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1540px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1925px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 2310px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
</div>
<div class="right-border">
<div class="shape-wrap">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 385px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 770px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1155px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1540px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 1925px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
<div class="shape-wrap" style="top: 2310px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10"></span>
</div>
</div>
<h1>Menu</h1>
<div class="line-2"></div>
<div class="vexel-images"></div>
<div class="col-1">
<h3 class="platter">Combination Platters</h3>
<p class="platter-info">Rice & Beans Included</p>
<p class="item item-1">Tostada & Taco</p><span class="price p1"><span class="s1">$</span>6.39</span>
<p class="item item-2">2 Beef Tacos</p><span class="price p2"><span class="s1">$</span>6.39</span>
<p class="item item-3">2 Enchiladas</p><span class="price p3"><span class="s1">$</span>6.39</span>
<p class="item item-4">Tostada & Enchilada</p><span class="price p4"><span class="s1">$</span>6.39</span>
<p class="item item-5">Taco & Enchilada</p><span class="price p5"><span class="s1">$</span>6.39</span>
<p class="item item-6">Burrito & Enchilada</p><span class="price p6"><span class="s1">$</span>6.39</span>
<p class="item item-7">2 Beef Burritos</p><span class="price p7"><span class="s1">$</span>7.45</span>
<p class="item item-8">2 Carne Asada Tacos</p><span class="price p8"><span class="s1">$</span>8.09</span>
<p class="item item-9">Chorizo</p><span class="price p9"><span class="s1">$</span>6.39</span>
<p class="item item-10">Carne Asada</p><span class="price p10"><span class="s1">$</span>8.19</span>
<p class="item item-11">Machaca</p><span class="price p11"><span class="s1">$</span>6.75</span>
<p class="item item-12">Carnitas</p><span class="price p12"><span class="s1">$</span>7.19</span>
<p class="item item-13">2 Fish Tacos</p><span class="price p13"><span class="s1">$</span>6.75</span>
<p class="item item-14">Chiles Rellenos</p><span class="price p14"><span class="s1">$</span>6.95</span>
<p class="item item-15">Red Combo</p><span class="price p15"><span class="s1">$</span>7.95</span>
<p class="item item-16">Green Combo</p><span class="price p16"><span class="s1">$</span>7.05</span>
<p class="item item-17">3 Rolled Tacos w/Guacamole</p><span class="price p17"><span class="s1">$</span>6.75</span>
<p class="item item-18">Chimichanga, Rice & Beans</p><span class="price p18"><span class="s1">$</span>7.05</span>
<p class="item item-19">Carne Asada Burrito</p><span class="price p19"><span class="s1">$</span>7.19</span>
<p class="item item-20">2 Tamales, Rice & Beans</p><span class="price p20"><span class="s1">$</span>7.05</span>
<h3 class="platter plat-4">Tacos</h3>
<p class="platter-info info4tacos">Folded</p>
<p class="item item-21">1 Chicken Taco</p><span class="price p21"><span class="s1">$</span>2.09</span>
<p class="item item-22">1 Beef</p><span class="price p22"><span class="s1">$</span>2.09</span>
<p class="item item-23">1 Carne Asada</p><span class="price p23"><span class="s1">$</span>2.61</span>
<p class="item item-21">1 Fish</p><span class="price p21"><span class="s1">$</span>2.64</span>
<p class="item item-22">1 Carnitas</p><span class="price p22"><span class="s1">$</span>2.64</span>
<p class="item item-23">1 Adobada</p><span class="price p23"><span class="s1">$</span>2.64</span>
<p class="item item-23">1 Cabeza</p><span class="price p23"><span class="s1">$</span>2.64</span>
<p class="platter-info info4tacos">Rolled</p>
<p class="item item-21">3 Plain with Cheese</p><span class="price p21"><span class="s1">$</span>2.39</span>
<p class="item item-22">3 Cheese and Guacamole</p><span class="price p22"><span class="s1">$</span>2.89</span>
<p class="item item-23">3 Chicken w/Cheese and Guacamole</p><span class="price p23"><span class="s1">$</span>2.89</span>
<p class="item item-21">3 Tacos w/Cheese and Guacamole</p><span class="price p21"><span class="s1">$</span>3.99</span>
<p class="item item-22">12 Tacos w/Cheese and Guacamole</p><span class="price p22"><span class="s1">$</span>8.99</span>
<h3 class="platter plat-7">Tortas</h3>
<p class="item item-21">Carne Asada</p><span class="price p21"><span class="s1">$</span>2.09</span>
<p class="item item-22">Machaca</p><span class="price p22"><span class="s1">$</span>2.09</span>
<p class="item item-23">Ham</p><span class="price p23"><span class="s1">$</span>2.61</span>
<p class="item item-21">Chorizo</p><span class="price p21"><span class="s1">$</span>2.64</span>
<p class="item item-22">Chicken</p><span class="price p22"><span class="s1">$</span>2.64</span>
<p class="item item-23">Carnitas</p><span class="price p23"><span class="s1">$</span>2.64</span>
<p class="item item-23">Fish</p><span class="price p23"><span class="s1">$</span>2.64</span>
<h3 class="platter plat-8">Breakfast Served Everyday</h3>
<p class="platter-info info4breakfast">6am to 11am</p>
<h3 class="platter plat-9">Breakfast Plates</h3>
<p class="item item-21">Huevos Racheros</p><span class="price p21"><span class="s1">$</span>6.29</span>
<p class="item item-22">Steaks Racheros</p><span class="price p22"><span class="s1">$</span>6.95</span>
<p class="item item-22">Scrambled Eggs w/Ham</p><span class="price p22"><span class="s1">$</span>5.95</span>
<p class="item item-22">Scrambled Eggs w/Suasage</p><span class="price p22"><span class="s1">$</span>5.95</span>
<p class="item item-22">Chorizo Omelette</p><span class="price p22"><span class="s1">$</span>6.95</span>
<p class="item item-22">Carne Asada Omelette</p><span class="price p22"><span class="s1">$</span>7.95</span><p class="item item-22">Scrambled Eggs w/Ham</p><span class="price p22"><span class="s1">$</span>5.95</span>
<p class="item item-22">Eggs and Bacon</p><span class="price p22"><span class="s1">$</span>5.95</span>
</div>
<div class="col-2">
<h3 class="platter plat-2">Enchiladas</h3>
<p class="item item-21">2 Cheese</p><span class="price p21"><span class="s1">$</span>4.55</span>
<p class="item item-22">2 Beef</p><span class="price p22"><span class="s1">$</span>4.65</span>
<p class="item item-23">2 Chicken</p><span class="price p23"><span class="s1">$</span>3.55</span>
<h3 class="platter plat-3">Side Orders</h3>
<p class="item item-24">Carne Asada Fries</p><span class="price p24"><span class="s1">$</span>4.55</span>
<p class="item item-25">Jalepenos</p><span class="price p25"><span class="s1">$</span>4.65</span>
<p class="item item-26">Quesadilla</p><span class="price p26"><span class="s1">$</span>3.55</span>
<p class="item item-27">Ham Quesadilla</p><span class="price p27"><span class="s1">$</span>4.55</span>
<p class="item item-28">1/2 Pint of Beans</p><span class="price p28"><span class="s1">$</span>4.65</span>
<p class="item item-29">1/2 Pint of rice</p><span class="price p29"><span class="s1">$</span>3.55</span>
<p class="item item-30">Ham Quesadilla</p><span class="price p30"><span class="s1">$</span>4.55</span>
<p class="item item-31">Super Nachos</p><span class="price p31"><span class="s1">$</span>4.65</span>
<p class="item item-32">1 Tamale</p><span class="price p32"><span class="s1">$</span>3.55</span>
<p class="item item-33">Extra Cheese Quacamole</p><span class="price p33"><span class="s1">$</span>4.55</span>
<p class="item item-34">Supreme Quesadilla</p><span class="price p34"><span class="s1">$</span>4.65</span>
<p class="item item-35">Chips and Quacamole</p><span class="price p35"><span class="s1">$</span>3.55</span>
<p class="item item-36">1 Chiles Rellano</p><span class="price p36"><span class="s1">$</span>4.55</span>
<p class="item item-37">Chips & Salsa</p><span class="price p37"><span class="s1">$</span>4.65</span>
<p class="item item-38">Churros</p><span class="price p38"><span class="s1">$</span>3.55</span>
<p class="item item-39">Burrito Asada R&B</p><span class="price p39"><span class="s1">$</span>4.55</span>
<p class="item item-40">1/2 Pint of Beans</p><span class="price p40"><span class="s1">$</span>4.65</span>
<p class="item item-41">1/2 Pint of rice</p><span class="price p41"><span class="s1">$</span>3.55</span>
<h3 class="platter plat-5">Tostadas</h3>
<p class="item item-38">Beef</p><span class="price p38"><span class="s1">$</span>2.85</span>
<p class="item item-39">Chicken</p><span class="price p39"><span class="s1">$</span>2.85</span>
<p class="item item-40">Bean</p><span class="price p40"><span class="s1">$</span>2.49</span>
<h3 class="platter plat-6">Burritos</h3>
<p class="item item-38">Red Chili</p><span class="price p38"><span class="s1">$</span>4.49</span>
<p class="item item-39">Carne Asada</p><span class="price p39"><span class="s1">$</span>4.90</span>
<p class="item item-40">California</p><span class="price p40"><span class="s1">$</span>4.90</span>
<p class="item item-38">Machaca</p><span class="price p38"><span class="s1">$</span>4.19</span>
<p class="item item-39">Mixed</p><span class="price p39"><span class="s1">$</span>4.19</span>
<p class="item item-40">Beef</p><span class="price p40"><span class="s1">$</span>4.19</span>
<p class="item item-38">Chicken</p><span class="price p38"><span class="s1">$</span>4.19</span>
<p class="item item-39">Beans</p><span class="price p39"><span class="s1">$</span>1.90</span>
<p class="item item-40">Fish</p><span class="price p40"><span class="s1">$</span>4.19</span>
<p class="item item-38">Carnitas</p><span class="price p38"><span class="s1">$</span>4.19</span>
<p class="item item-39">Chimichanga</p><span class="price p39"><span class="s1">$</span>5.85</span>
<p class="item item-40">Chile Relleno</p><span class="price p40"><span class="s1">$</span>4.49</span>
<p class="item item-38">Adobada</p><span class="price p38"><span class="s1">$</span>4.19</span>
<p class="item item-39">Green Chile</p><span class="price p39"><span class="s1">$</span>4.49</span>
<p class="item item-40">Shrimp</p><span class="price p40"><span class="s1">$</span>5.65</span>
<p class="item item-38">Cabeza</p><span class="price p38"><span class="s1">$</span>4.75</span>
<p class="item item-39">Pollo Asado</p><span class="price p39"><span class="s1">$</span>4.75</span>
<h3 class="platter plat-10">Breakfast Burritos</h3>
<p class="item item-21">Suasage & Egg</p><span class="price p21"><span class="s1">$</span>4.09</span>
<p class="item item-22">Ham & Eggs</p><span class="price p22"><span class="s1">$</span>4.09</span>
<p class="item item-22">Bacon & Eggs</p><span class="price p22"><span class="s1">$</span>4.09</span>
<p class="item item-22">Steak & Chorizon</p><span class="price p22"><span class="s1">$</span>4.75</span>
<p class="item item-22">Picodegallo eggs & cheese</p><span class="price p22"><span class="s1">$</span>3.95</span>
<p class="item item-22">Chorizo & Eggs</p><span class="price p22"><span class="s1">$</span>4.85</span>
<p class="item item-22">Chorizo & Eggs</p><span class="price p22"><span class="s1">$</span>4.09</span>
</div>
</div>
</section>
<section id="hours">
<div class="container">
<div class="shape-wrap" style="top: 250px; left: 70px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3 move3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10 move10"></span>
</div>
<div class="shape-wrap rotate" style="top: 543px; left: -240px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3 move3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10 move10"></span>
</div>
<h1>Hours</h1>
<div class="hours-line"></div>
<div class="hours-line2"></div>
<div class="grid">
<div class="day">Sunday</div>
<div class="hour">8am - 8pm</div>
<div class="day">Monday</div>
<div class="hour">6am - 10am</div>
<div class="day">Tuesday</div>
<div class="hour">6am - 10am</div>
<div class="day">Wednesday</div>
<div class="hour">6am - 10am</div>
<div class="day">Thursday</div>
<div class="hour">6am - 10am</div>
<div class="day">Friday</div>
<div class="hour">6am - 10am</div>
<div class="day">Saturday</div>
<div class="hour">6am - 10am</div>
</div>
<div class="shape-wrap" style="top: -470px; left: 980px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3 move3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10 move10"></span>
</div>
<div class="shape-wrap lom" style="top: -175px; left: -90px;">
<span class="shape-1"></span>
<span class="shape-2"></span>
<span class="shape-3 move3"></span>
<span class="shape-4"></span>
<span class="shape-5"></span>
<span class="shape-6"></span>
<span class="shape-7"></span>
<span class="shape-8"></span>
<span class="shape-9"></span>
<span class="shape-10 move10"></span>
</div>
</div>
</section>
<script src="script.js"></script>
</body>
</html>
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-12-22 21:07:50
您可以将overflow: hidden;添加到#hours, #menu以修复它。
问题是，剪辑路径正在使他们的孩子变得更大，位置也很奇怪。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53899208
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号