Problems with Adaptability and Carousel on Mobile Devices

Hello people,

I’m having a number of issues with my business on mobile devices, and I’d love the community’s assistance in sorting them out. Here are the issues I’m facing:

Website no opening on some smart devices:

• On some products, the site doesn’t load at all. On another, it loads but with design problems.

Carousel on the pages no showing:

• On some products, the gondola on the blog doesn’t look.

Extra place after the footer/credits:

• There’s more space after the foot on some webpages. On another, things like “item 0”, “item 1”, etc., look.

I’ve been using AI to solve this problem, but it just keeps coming back.

I’m using Css for the structure and carousel.
I’ve tailored photos and pdf CSS/JS files.

I appreciate any help or ideas. To better explain the issues, here are some pictures:

Hi Paga,

Pleasant to the website.

A link to your website or an example of a website running on something like would be more helpful in this situation.

Thanks

Sure i can post it, here- https ://zedacalmacalçadas.pt/index .html

Are you using the appropriate style and java scripts, e.g., the exact version for bootstrap?

I just ran tests using these documents.

When the code is broken down to the gondola, it appears to be working.

I would copy your score, please. browser e. g. version to index-test. begin removing or commenting out your various codes and standards.

I see you have codes for owl-carousel, which don’t appear to be needed.

If you can replace parts and codes one by one e. g.comment out lozad, you might be able to remove the conflict/issue

Someone else these might be able to provide more insight into the subject matter’s apparent lack of depravity when the photograph heights are at the bottom during transition.

Yes, I have been working on a few things, including the photo levels. The owl-carrousel was a Microsoft Copilot project that attempted to resolve the problem.

You don’t seem to be using the whole css data. Consider the 5.02 type that pointed out in his article above. Some of the gondola rules are missing, and it appears you have a tailored version.

On my mobile device and my friend’s mobile device, the website doesn’t even available, despite the fact that it appears to have fixed the midst issue.

Not that this helps, but when I check your website on my Android phone, I can’t see the place or products listed.

There are no listing items in your source code when you look at it in inspector, but instead you can look at your principal. No code that would make those list items appears to exist that can be used.

But very unusual.

Due to the 6em bottom percentage on the foot and the margin-bottom and padding-bottom on the box, there is a space after the picture on the carousel.

As long as the script is still in resource, you can override them in this way.

/* Footer styles */.footer { margin-top: 0rem;}.container-fluid.carousel{ padding-bottom:0!important; margin-bottom:0!important;}

On my phone, it opens up fine, so you might want to clean the cache. ( I assume you don’t have JS disabled on those devices. )

However, you may still try to fix these issues.

I don’t think that one, but the ones from my photos that say material 0, product 1, product 2, and others.

What do you think could be causing the issue with some mobile devices where the website won’t be open, it just appears with a loading screen and doesn’t move from that? Also, since you can access the website via mobile,

Have you cleared the website stash on that system, as I previously mentioned above?

Furthermore, what browsers and devices are you having issues with.

Your mobile list on both of my iPhones runs smoothly in Safari iphone because you have light text on a white background.

Give it some shade.

.navbar .navbar-nav .nav-link{color:#000;}

Moreover, you don’t want that bad-looking” little url” image to be 100 % on small devices.

You may replace the width100 % from this rule.

 @media (max-width: 768px) { .footer-item img { /* width: 100%; */ height: auto; } }

The place after the foot for my Samsung Galaxy S20 Ultra in Chrome and an adsense website also appears, but the devices from my friends who can’t access the website are a Motorola and an AliExpress portable model, so to learn more about the models I would have to ask. I tried to clear the memory on my phone, and the page appears to work without spaces, but the navbar appears pale and the elements are also visible light.

I fixed the whitened words in my previous article, thanks.

Oh no, the portable navbar appeared light when the navbar is orange and the letters are white, that’s not what I mean.

The same goes for the desktop, but the top crossbar has no background colour. White text is displayed on a light background.

you seem to be missing the tone for navbar-bg.

e.g.

If you add a backdrop to that design, the header may appear.

e.g.

container-fluid.navbar-bg{ background:orange;/* change to suit*/}

When the portable menu is open, that color will also appear in the menu.

Thank you, I see. Moreover, could you please explain why I have to put this directly to css inline on my css file instead of my html, which doesn’t seem to work when I made the change?

When adding it to a css file, make sure the more css is at the end of the css files then the original rule will override and the navbar will be once more light.

When you use frameworks, you typically create a custom html file, and the custom css file is always the last one in the source. In this way, you don’t need to alter the platform code at all, but you can instead make your modifications in the custom CSS file.

If you placed the html code last in cause but it still failed, that would indicate a sensitivity issue ( or a dynamic scripted change ). But, when I tested the code I provided for you, I just injected it survive into your page at the end of source, and it turned out fine.

As a last resort, you can add something that is crucial to the concept, but that is bad advice because you end up with an overwhelming file. Unless of course you are over-riding some power courses which are already using !important and then you also need !important.

Learn the devtools in your computer and you’ll be able to see all the models and where they came from. Devtools are the best tool for developing/altering script, but it takes a little bit of practice and learning.

Although it didn’t job when I put the code at last in the CSS file, the type in the html works properly. Could you tell me how flexible the smart experience is right now? I removed the cache after you told me, but the foot image nevertheless appears better on my phone in an adblock browser even though I cleared the cache.