Bootstrap width whitespace issue avilon theme - html

I having issues that you can drag website to left and it seems like width is larger than viewport.
When website load it seems to work but then i can click left on mouse and drag it....and then you see whitespace that appear.
No idea where this is happening. Im using https://bootstrapmade.com/demo/themes/Avilon/ theme.
See images below:
Problem image where you can see whitespace
How it suppose to look

Related

Blank space at bottom of footer (on Mobile)

I'm trying to fix a blank space at bottom of footer (I'm seeing in iPhone 7 Plus mobile). I honestly need help with this.
I've tried various methods (ie: overflow, margin, padding) and none had worked. I also tried to view mobile version on page testing sites but they don't show any blank space.
Odd or is it just my phone?
Looking through your code - this img element seems to be creating the issue:
<img src="https://tags.rd.linksynergy.com/cs?ns=ssc&uid3=5d062c714cedfd0012d95054">
Oddly enough, the img element is only there when I first visit the page. If I refresh the page, the element is gone. This leads me to believe that there is some JavaScript dynamically adding it to the HTML. The image itself seems to broken and never loads either. See screenshot below.
You might want to remove this <img> added the end of the file

Having an issue getting background images to behave the same on my webpage

http://codercarter.com
I am working on this site for a class, and I have an issue I cannot seem to find the problem for. The background image at the EXPERIENCE section doesn't reach the ends of the pages like the first two background images do, and Im not sure what is causing it. In addition to this on the old version of the site, the three contact buttons used to be side-by-side of each other, now when I see the new version there are two, and the github connection is below them and very wide?
The last image does not reach the edge because it is inside of the "portfolio" div, which has margins. For the button issue, you can assign something like "max-width: 30%;" to each of the 3 ".card" elements.

Slick carousel content does not show

I'm having a problem with a slick carousel that loads and works (verified with Element Inspector) but does not appears on screen. Another slick carousel works fine in the same page. I've gone through it many times but can't find the problem and it's driving me nuts. Here's the link to the page, go to EXPERIENCIA section:
http://nhtest.esy.es/buro/index-06-06.html
Notice that the containing div displays perfectly, I've added it some text and a red border to check it.
You can see below the navbar that the main slick carousel works fine, but this other one doesn't display its contents. If you inspect it in small devices size, you can see that the first image loads, and then disappears, and if you look in the code inspector, you will see it working, but not displaying. For some reason it doesn't even show the first image in responsive inspection mode.
Looking forward to your answers, many thanks in advance!

White space in top/bottom of header on mobile (WordPress)

Working on a WordPress website.
Everything looks fine on desktop but on mobile there is a significant amount of whitespace at the top and bottom of the header.
New to WordPress so I'm having a hard time figuring out what is going on.
Here's a link to the website: http://reluctant.ceo
I would like to note that when I change the size of my browser window this problem does not occur, only when I'm looking at it on my iPhone.
Also, when I turn of "responsive layout" in the theme options I still have this issue on my iPhone.
One more thing, not sure if it matters but the header is using Slider Revolution.
The issue was that I had my revolution slider inside of a VC row element. I needed to delete the row and simply replace it with just the revolution slider instead of placing the slider inside a row.

iFrame displaying outside div in IE11

I have a problem with a site displaying correctly in IE11. Everything is fine in Firefox and Chrome.
It is built using zen cart and the index page is made up of a series of html banners. One of these banners contains the code to display a twitter feed. In IE11 this is being output outside of the div it is supposed to be in.
I'm looking for suggestions on how to fix this issue. I tried adding an IE specific line in the stylesheet to move it up but it goes so far, until the top of the feed is roughly aligned to the bottom of the coloured heading next to it, and then one pixel more and it jumps up dramatically.
I resolved this by removing the height and margin-top that i had set on the original div and then added new positioning to the stylesheet using the class in the embedded code provided by twitter. The additional css i added is just loaded up along with the embedded css.