Hi, On mobile, when you swipe the screen to the left, a space is created on the right. The problem is fixed by deleting the carousel part. Can you help? <! Carousel ============================================= > <section id="content"> <div class="content"> <div class="container clearfix"> <div class="row clearfix"> </div> </div> </div> </div> </div> <div class="clear"></div> <div class="section m 0 dark" style="backgrou…

Mobile Right Space Problem Support Please

TtanersenFeb 1, 2022

Hi, On mobile, when you swipe the screen to the left, a space is created on the right. The problem is fixed by deleting the carousel part. Can you help?

	&lt;!-- Carousel
	============================================= --&gt;
	&lt;section id="content"&gt;
		&lt;div class="content"&gt;
			&lt;div class="container clearfix"&gt;
					&lt;div class="row clearfix"&gt;
						&lt;/div&gt;
					&lt;/div&gt;
				&lt;/div&gt;

				&lt;/div&gt;
			&lt;/div&gt;

			&lt;div class="clear"&gt;&lt;/div&gt;

			&lt;div class="section m-0 dark" style="background: linear-gradient(rgb(249, 249, 249), rgba(222, 198, 154)), url('') center center no-repeat; background-size: cover; padding: 80px 0 250px"&gt;
				&lt;div class="container"&gt;
					&lt;div class="heading center mx-auto" style="max-width: 700px"&gt;
						&lt;h2 class="color h3 fw-bold mb-3" style="text-align: center;"&gt;&lt;span style="color: #000000;"&gt;FAALİYETLERİMİZ&lt;/span&gt;&lt;/h2&gt;
						&lt;p&gt;&lt;span style="color: #000000;"&gt;Size sunduğumuz hizmetler:&lt;/span&gt;&lt;/p&gt;
					&lt;/div&gt;
				&lt;/div&gt;
			&lt;/div&gt;

			&lt;div class="negetive-margin"&gt;
				&lt;div class="container"&gt;
					&lt;div id="cleaner-carousel" class="owl-carousel carousel-widget" data-margin="25" data-nav="true" data-pagi="true" data-items-xs="1" data-items-sm="2" data-items-md="3" data-items-lg="4" data-items-xl="5"&gt;
						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;İstanbul Mihmandarlığı&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Stratejik İletişim Danışmanlığı&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Medya İletişim Koordinatörlüğü&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Prodüksiyon Hizmetleri&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Kurumsal Danışmanlık&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Kültür Sanat Etkinlikleri&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;
						
						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;STK Buluşmaları&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Etkili İletişim Seminerleri&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Seminer, Panel ve Sempozyumlar&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Gezi Organizasyonları&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Sportif Faaliyetler&lt;br&gt;&lt;br&gt;&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;

						&lt;div class="card border-0 shadow-sm"&gt;

							&lt;div class="card-body second-bg-color rounded-bottom p-3"&gt;
								&lt;h4 class="card-title"&gt;Lansman, Fuar ve Kongreler&lt;/h4&gt;
							&lt;/div&gt;
						&lt;/div&gt;
					&lt;/div&gt;
				&lt;/div&gt;
			&lt;/div&gt;

			&lt;!-- &lt;div class="section m-0"&gt;
				&lt;div class="container clearfix"&gt;

				&lt;/div&gt;
			&lt;/div&gt; --&gt; &lt;!-- #--&gt;

&lt;style&gt;

	.demos-filter {
		margin: 0;
		text-align: right;
	}

	.demos-filter li {
		list-style: none;
		margin: 10px 0px;
	}

	.demos-filter li a {
		display: block;
		border: 0;
		text-transform: uppercase;
		letter-spacing: 1px;
		color: #444;
	}

	.demos-filter li a:hover,
	.demos-filter li.activeFilter a { color: #3d4a6e; }

	@media (max-width: 992px) {
		.demos-filter { text-align: center; }

		.demos-filter li {
			float: left;
			width: 33.3%;
			padding: 0 20px;
		}
	}

	@media (max-width: 800px) { .demos-filter li { width: 50%; } }

	#portfolio_wrapper .tp-loader.spinner3{ background-color: #313437 !important; } &lt;/style&gt;
			&lt;style type="text/css"&gt;#portfolio .uranus.tparrows{width:50px; height:50px; background:rgba(255,255,255,0)}#portfolio .uranus.tparrows:before{width:50px; height:50px; line-height:50px; font-size:40px; transition:all 0.3s;-webkit-transition:all 0.3s}#portfolio .uranus.tparrows:hover:before{opacity:0.75}

&lt;/style&gt;

SSemicolon WebSTAFFFeb 2, 2022

Hello,

We have just tried checking this out on a Live Page with a Carousel: https://themes.semicolonweb.com/html/canvas/carousel.html and this issue does not exist for us. Can you please provide us with a Live URL so that we can check out the exact issue and provide you with more accurate assistance on this. Thanks for your Patience.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

TtanersenFeb 2, 2022

Hi, demo web site link: www.istanbuliletisimofisi.com

TtanersenFeb 2, 2022

When you pull the screen to the left on mobile, a space is created in the right part.

SSemicolon WebSTAFFFeb 2, 2022

Hello,

There are too many Validation Errors: https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.istanbuliletisimofisi.com%2F on your Page. Additionally, make sure that your content is inside the #content > .content-wrap DIV as mentioned in the Documentation: https://docs.semicolonweb.com/docs/getting-started/html-structure/ .

This should automatically fix your issue. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

TtanersenFeb 2, 2022

I tried to do as you said but I couldn't or it didn't work. Can you help in detail?

SSemicolon WebSTAFFFeb 2, 2022

Hello,

First, it would be great if you can please update your Website online after fixing all the Validation Errors as mentioned here: https://validator.w3.org/nu/?doc=https%3A%2F%2Fwww.istanbuliletisimofisi.com%2F, especially with the Duplicate IDs and Unclosed HTML Tags.

Second, make sure that all your Main Site Content except the Header/Footer/Slider etc. is inside the .content-wrap DIV. This will properly structure your Content and wont break the default site functionality.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.