[Resolved] No responsive in categories

[Alejandro]

Good morning, after placing the adsense code in the web template code (before closing /head>), the articles load the ads correctly, but on mobile the responsiveness is lost. We attach a video so you can see it. Could you help us to solve this problem in the categories? Thank you

[Fernando]

Hi Alejandro,

Can you try adding this CSS in Appearance > Customize > Additional CSS?:

body {
    overflow-x: hidden;
}

[Alejandro]

Good morning, it does not solve the problem…

Could you give me another solution?
Thank you

[Fernando]

Can you try copying and pasting all custom CSS code you have in Additional CSS here?: http://csslint.net/

There’s a couple of syntax errors in some of your codes. Can you correct them first?

[Alejandro]

/* responsive categorias */
body {
    overflow-x: hidden;
}
/* Author box fondo */
#main .autor .author_box{
	background-image:url("https://mundoentrenamiento.com/wp-content/uploads/2022/05/fondo-autor.png");
}

/* reduccion de parrafo de metadescripcion */
.entry-header .single-excerpt p{
	font-size:20px;
}

/* titulo de sidebar sangrado */
.inside-right-sidebar .widget .widget-title{
	padding-left:22px;
	
}
/* indice menor separacion*/
#toc_container{
	line-height:1em;
	
}

/* 767px and smaller screen sizes */
@media (max-width:767px){

	/*indice menor sepracion */
	#toc_container{
		position:relative;
		right:8px;
		line-height:1em;
	}
	
}

/* sidebar sombreado azul en cursos y rutinas */
.inside-right-sidebar .widget .widget-title{
	background-color:#1d70b8;
	color:#ffffff;
	
}

/* ultimos articulos sidebar mas separacion*/
.inside-right-sidebar ul li{
	padding-bottom:19px;
	background-color:#ffffff;
	text-decoration:none;
	font-weight:400;
	text-align:left;
	
}
/* items sangrado menor */
.page-header ul li{
	font-size:19px;
	position:relative;
	left:-35px;
	
}
/* items artículo sangrado menor */
.entry-content > ul li{
	font-size:19px;
	position:relative;
	left:-25px;
	
}

/* items numericos bibliografia sangrado menor */
.inside-article ol li{
	position:relative;
	left:-20px;
	
}
/* ocultar hamburguesa */
@media (max-width: 768px) {
    button.menu-toggle.secondary-menu-toggle:before {
        display: none;
    }
}	

/* Sangrado izquierda menu secundario movil */
	#secondary-navigation .inside-navigation .secondary-menu-toggle{
		text-align:left;
		
	}
	
}

/* informacion basica proteccion datos en comentarios */
#commentform h3{
	padding-bottom:0px;
	padding-top:21px;
}

/* fondo gris */
#commentform ul li{
	background-color:#f7f7f7;
	background-position-x:0%;
	background-position-y:0%;
	background-attachment:scroll;
	font-size:10px;
	line-height:1.5em;
	
}

/* Parrafos destacados */
.inside-article .css-estilo-alerta{
	padding-top:12px;
	padding-bottom:12px;
	background-image:url("https://mundoentrenamiento.com/wp-content/uploads/2022/05/fondo-autor.png");
	background-size:auto;
	border-width:1px;
	border-style:dashed;
	border-color:#000000;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	padding-left:15px;
	padding-right:15px;
	margin-bottom:32px;
	margin-top:15px;
	
}

/* indice */
#toc_container{
	line-height:1.3em;
	
}

/* color azul en indice */
.toc_list li a{
	color:#1e73bd !important;
	font-weight:400;
	font-family:'Open Sans', sans-serif;
	line-height:1.8em;
	
}
/* Estética de artículos relacionados */
#main .related-posts a{
	background-color:#1e73bd;
	text-decoration:none;
	color:#ffffff;
}
/*Azul pasar raton enlaces */
.single .entry-content a:hover{
	background:#f0f0f0;
	color: black;
}
/*Subrallado enlaces */
.single .entry-content a:not(.button):not(.more-link):not(ul.toc_list a):not(.author_box):not(.author_box.author_namea):not(.author_box .author_name a):not(.page-id-8) {
    border-bottom: 2px solid #1e73bd;
    text-decoration: none
	}
/*Tamaño de la fuente */
p {
  font-weight: 350 !important;
}

/* Tamaño migas de pan grosor y color rojo*/
.rank-math-breadcrumb {
	font-size:16px;
}
.rank-math-breadcrumb p a{
	color:#1e73bd;
	
}
/* Separar extracto de titulo h1 */
.entry-header .single-excerpt p{
	margin-top:15px;
	
}
/* CAJA DE AUTOR */

.autor .author_box {
    font-size: 18px
}
.autor .author_box .author_description {
    font-size: 14px
}
.author_box img {
    float: left;
    margin-right: 13px;
    margin-bottom: 1px
}

.autor .author_box {
    border-style: solid;
    border-width: 1px;
    border-color:#ddd;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px
}
.autor .author_box .author_name {
    border-bottom-width: 2px;
    border-bottom-style: solid
}
.read-more-state {
    display: none
}
.read-more-target {
    opacity: 0;
    max-height: 0;
    font-size: 0;
    transition: .25s ease
}
.read-more-state:checked ~ .read-more-wrap .read-more-target {
    opacity: 1;
    font-size: 14px;
    max-height: 999em
}
.read-more-state~.read-more-trigger:before {
    content: '+'
}
.read-more-state:checked~.read-more-trigger:before {
    content: '-';
    padding-bottom: 151px
}
.read-more-trigger {
    cursor: pointer;
    display: inline-block;
    padding: 0 .5em;
    color: #666;
    font-size: 14px;
    line-height: 2;
    border: 1px solid #ddd;
    border-radius: .1em;
    float: right
}
.author_box span ul {
    float: right
}
.author_box span .read-more-wrap {
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 40px;
    margin-left: 16px
}
.author_box span label {
    background-color: #ffcd00
}
/* Seccion categoria ajuste */
body.category .hentry h2{
		margin-bottom:-50px;
	  margin-top:-21px;
	  font-size:25px;
	}

/* Related posts */
.related-posts{
	display: flex;
	flex-wrap: wrap;
}

.related-posts a{
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: 33.3333%;
	flex-basis: 200px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color:#ffcd00;
	padding-left:8px;
	padding-right:8px;
	padding-top:14px;
	padding-bottom:14px;
	margin: 2px .3em 0 auto;
}
/* CSS TABLE OF CONTENT PLUS */
#toc_container li,#toc_container ul{margin:0;padding:0}#toc_container.no_bullets li,#toc_container.no_bullets ul,#toc_container.no_bullets ul li,.toc_widget_list.no_bullets,.toc_widget_list.no_bullets li{background:0 0;list-style-type:none;list-style:none}#toc_container.have_bullets li{padding-left:12px}#toc_container ul ul{margin-left:1.5em}#toc_container{background:#fff;border:1px solid #aaa;padding:10px;margin-bottom:1em;width:auto;display:table;font-size:95%}#toc_container.toc_light_blue{background:#edf6ff}#toc_container.toc_white{background:#fff}#toc_container.toc_black{background:#000}#toc_container.toc_transparent{background:none transparent}#toc_container p.toc_title{text-align:center;font-weight:700;margin:0;padding:0}#toc_container.toc_black p.toc_title{color:#aaa}#toc_container span.toc_toggle{font-weight:400;font-size:90%}#toc_container p.toc_title+ul.toc_list{margin-top:1em}.toc_wrap_left{float:left;margin-right:10px}.toc_wrap_right{float:right;margin-left:10px}#toc_container a{text-decoration:none;text-shadow:none}#toc_container a:hover{text-decoration:underline}.toc_sitemap_posts_letter{font-size:1.5em;font-style:italic}
/* separacion table TOC */
#toc_container{
	width:100% !important;
	line-height:2.3em;
}
toc_container p.toc_title a, #toc_container ul.toc_list a {
    color: #DA1010;
}

.related-posts a b{
	font-weight:400;
	text-align:center;
	float:left;
}
.related-posts-titulo:before {
    content: ' \1F4D6';
	  display: inline-block;
	  text-indent: 5px;

}
/* separacion table TOC */
.rgpd-antes,
.rgpd-despues {
    background-color: #e6e6e6;
    margin-top: 12px;
    padding-top: 10px
}
/* Texto caja comentarios */
#commentform ul li{
	font-size:16px;
}
#commentform{
	font-size:18px;
	
}
/* Botón check box espacios */
#webappdesign_accept_gdpr_comments{
	margin-left:7px;
	margin-right:5px;
	
}
/* Menu BARRA LATERAL ESCRITORIO */
/* Side menu CSS */
/* EMPIEZA MENU escritorio */
@media (min-width:600px){
#secondary-navigation .inside-navigation{
	
    position: fixed;
    left: 0; /* Change to right: 0; */
    top: 0;
	  padding-top: 4%;
    width: 250px;
    z-index: 300;
    height: 100%;
    overflow: auto;
    overflow-x: hidden;
    -webkit-backface-visibility: hidden;
    -webkit-overflow-scrolling: touch;
    transition: .1s ease;
	  border-right-style:solid;
	  border-right-width:1px;
	  border-right-color:#e0e0e0;
}

body {
    margin-left: 250px; /* change to margin-right: 200px; */
}
#secondary-navigation .sub-menu a{
	padding-right:90px;
	
}
}
/*Menu secundario expandido  ver submenus */

/*Menu secundario ajustado cuando esta activo una categoria */
@media (min-width:600px){
.secondary-navigation .main-nav .current-menu-item .sub-menu,
.secondary-navigation .main-nav .current-menu-ancestor .sub-menu {
	opacity: 1;
	left: auto;
	right: auto !important;
	position: relative;
	width: 100%;
	clear: both !important;
	top: auto;
	float: none;
	visibility: visible !important;
	pointer-events: auto;
	height: auto;
	display: block;
	box-shadow: none;
}

.current-menu-item .dropdown-menu-toggle,
.current-menu-ancestor .dropdown-menu-toggle {
    display: none;
}

}
/*Menu secundario fijo al bajar*/

@media (max-width:600px){

	/* Inside navigation */
	#secondary-navigation .inside-navigation{
		border-bottom-width:1px;
		border-bottom-style:solid;
		border-bottom-color:#dbdbdb;
	}
	
	/* Svg ocultar icono */
	.secondary-menu-toggle .icon-menu-bars svg{
		display:none;
	}
		#secondary-navigation .inside-navigation .mobile-menu{
		word-spacing:10px;
		
	}
	/* FLECHA ABAJO CATEGORIA */
	#secondary-navigation .inside-navigation .secondary-menu-toggle:after{
		content: ' \276F';
		display: inline-block;
		transform: rotate(90deg);
		margin-left:50% !important;

		font-size:22px;
	}
			.mobile-menu-open	#secondary-navigation .inside-navigation .secondary-menu-toggle:after{
		display: none;

	}
	
}

/*Stiky navigation dos menus */

#secondary-navigation {
    position: -webkit-sticky;
    position: sticky;
    top: 92px; /* Height of header */
}
/* Adjust position for mobile header */
@media(max-width: 600px) {
    #secondary-navigation {
        top: 0px;
			  box-shadow:0px 2px 11px -8px #222222
    }
}
/* CAMBIAR POSICION SIDEBAR PARA TABLET */
@media (max-width: 1024px) {
    .site-content {
        flex-direction: column;
    }
    .site-content .content-area, .site-content .is-right-sidebar {
        width: 100%;
    }
}

/* Fact checked */

.read-more-fect {
    display: none
}
.read-more-fecttarget {
    opacity: 0;
    max-height: 0;
    font-size: 0;
    transition: .25s ease
}
.read-more-fect:checked~.read-more-wrap .read-more-fecttarget {
    opacity: 1;
    font-size: 16px;
    max-height: 999em
}
.read-more-fect~.read-more-fecttrigger:before {
    content: '✓ '
}
.read-more-fect:checked~.read-more-fecttrigger:before {
    content: '-';
    padding-bottom: 181px
}
.read-more-fecttrigger {
    cursor: pointer;
    display: inline-block;
    padding: 0 .5em;
    color: #008504;
    font-size: 16px;
    line-height: 2;
    border-bottom: 1px solid;
    float: right
}
.read-more-fecttrigger:hover {
    color: #333
}
/* Separacion articulos relacionados */
#main .related-posts-titulo{
padding-top:20px;
}

[Fernando]

I meant copy and paste it here: http://csslint.net/

You’ll see the errors you’ll need to address.

[Alejandro]

I have 87 errors and 130 warnings, could you tell me where you see a specific error that affects that responsive view on mobile?

[Fernando]

When I tested, there’s only 9 errors. You can disregard the warnings and focus on fixing the errors.

In the test, it specifies the specific lines and corrections you need to make to do away with the errors.

[Alejandro]

Good morning, the code is now clean of errors and the error persists.
https://ibb.co/8BS1bhf

[David]

Its the way the auto adverts are being injected, they are too wide for their placement.
Change Fernandos CSS to this:

html,
body {
    overflow-x: hidden;
}

[Alejandro]

solved. Many thanks

The best support I have ever come across.

congratulations for your work

[David]

Glad we could be of help

[Author]

Posts