Question

我在此网站上进行更改时遇到一些问题http://rocainternacional.org/2018/在移动设备中，您可以向右滚动。它为什么会发生？我想隐藏视频溢出，并且大小覆盖范围......

＆＃13;

.body {
  overflow: hidden;
}

.titulos {
	margin-top: 200px;
	padding: 0 100px;
	margin-bottom: 200px;
}
.titulos2 {
	margin-top: 300px;
	padding: 0 100px;
	margin-bottom: 200px;
}
.titulo-1 {
	background-color: rgba(255, 255, 255, 0.8);
	color: rgb(0, 153, 120);
}
.titulo-1 h2 {
	margin-bottom: 0;
	margin-top: 0;
	padding: 20px;
	font-weight: 300;
	padding-left: 70px;
	font-size: 35px;
}
.titulo-2 {
	background-color: rgba(0, 153, 120, 0.5);
	color: rgb(255, 255, 255);
}
.titulo-2 h2 {
	margin-top: 0 !important;
	font-size: 30px;
	padding: 50px;
	padding-left: 70px;
}
.boton-right {
	display: flex;
    justify-content: flex-end;
}
.titulo-boton {
	background-color: #001F4A;
	margin-top: 0;
	margin-bottom: 0;
	padding: 15px 30px;
}
.titulo-boton a {
	color: #fff;
	font-weight: 300;
	font-size: 20px
}

.footer-title {
	margin: 0 auto;
	margin-top: 30px;
}

.item-1, 
.item-2, 
.item-3 {
	position: absolute;
  display: block;
	/*top: 2em;*/
  width: 60%;
  padding-left: 0px;
  font-size: 2em;

	animation-duration: 10s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}

.item-1{
	animation-name: anim-1;
}

.item-2{
	animation-name: anim-2;
}

.item-3{
	animation-name: anim-3;
}

@keyframes anim-1 {
	0%, 8.3% { left: -100%; opacity: 0; }
  8.3%,25% { left: 25%; opacity: 1; }
  33.33%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-2 {
	0%, 33.33% { left: -100%; opacity: 0; }
  41.63%, 58.29% { left: 25%; opacity: 1; }
  66.66%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-3 {
	0%, 66.66% { left: -100%; opacity: 0; }
  74.96%, 91.62% { left: 25%; opacity: 1; }
  100% { left: 110%; opacity: 0; }
}

@media only screen and (max-width: 2000px) {
	.titulo-1 {
		width: 350px;
	}

	.item-1, .item-2, .item-3 {
		width: 50%;
		padding-left: 50px !important;
	}
}

@media only screen and (max-width: 1700px) {
	.item-1, .item-2, .item-3 {
		width: 55%;
		padding-left: 0px !important;
	}
}

.text-blue {
	color: #337ab7 !important;
}

.opinion {
	margin-bottom: 30px;
}

＆＃13;

       <!-- HTML CODE -->
       <!-- Here are the slider elements -->
       <!-- In desktop overflow: hidden works fine, but in mobile it doesnt -->

			<div class="container titulos" id="slideshow">
				<div class="row titulo-1">
					<h2>Bienvenidos a R.O.C.A. Internacional</h2>
				</div>
				<div class="row titulo-2" style="height: 200px">
					<h2 class="item-1 no-padding-left">Capacitación profesional en todas las especialidades de la Odontología con Certificación Universitaria.</h2>
					<h2 class="item-2 no-padding-left">Diplomados de alto nivel, dictado por docentes de reconocimiento intenacional.</h2>
					<h2 class="item-3 no-padding-left">Red Odontológica de Capacitación Internacional.</h2>
				</div>
				
				<div class="row boton-right">
					<div class="titulo-boton">
						<a href="" class="">Conocer más</a>
					</div>
				</div>
			</div>

＆＃13;

在桌面上溢出：隐藏工作正常，但在移动设备中它没有.. 有什么建议吗？

编辑：我将这个元标记添加到头部并完成了诀窍

注意：我如何将这篇文章视为完成？

Answer 1

尝试隐藏身体标签溢出..

Answer 2

这个元标记做了伎俩

现在在移动设备上工作得很完美..

没有隐藏在手机上的溢出视频

2 个答案: