Bootstrap carousel collapses - html

I've just got the problem that I've never faced before. So, I've got Bootstrap Carousel on web-site, the problem is that carousel collapses the next slide. It just dissapears. Looked over the code - didn't find any mistakes. Can you help me?
Web-site - http://www.navigator-surgut.ru
Image 1

Looks like MooTools is modifying the top margin of the carousel's container element. Not sure how/why though.

Disabling MooTols worked for me pretty well.

Related

Navigation bar hiding web page contents and sidebar contents in html

I'm making a web page to try to learn HTML, CSS, PHP, and Javascript better. I've been revisiting the code trying to work out a few bugs and I discovered that my search bar is hiding the page contents and a button on my sidebar. I spent about 10 to 11 hours this week to try to fix the problem. The thing is though I'm not sure what the problem is and so I don't know which part of my code to post. All I need help with is identifying a few possible problems. If you have an idea what the problem might be I would really appreciate your help. So far none of my ideas have worked.
Here is a picture of what the page currently looks like.
Can you try adding a css property of padding-top: 100px; to the content under the header and see if that does anything?
from the diagram it looks as if your search bar has been removed from the normal document flow. This is usually done in CSS setting the position attribute to absolute or fixed rather than static or relative.
Check your styling for position and set it to static or relative.

CSS navigation bar hover not activating

I have been trying to make this seriously simple hover for my portfolio website but after testing with every single existing option I do not seem capable of managing to work.
I have read lots of threads about this issue but none seemed to give a proper solution which worked.
Please find below an image of the code I have for my nav bar:
Image
It is really not hard but the hover is stubborn.
I have traded and modified everything and I am now out of hopes.
Can any of you be so kind and see what could be the cause for this?
PS: It is not the final hover form since I was simply testing.
I finally managed to fix the issue!
It was as simple as it looked, basically had a z-index bigger than the nav div and when I changed this it started working.
Thank you all for your time I hope this somehow helps anyone else who's troubled.
Please remove the class animated & zoomIn from it. These class are from animate.css so it might create an issue.

Bootstrap white space on the right on mobile view

So working on this website and faced with an issue of blank space on the right side of the page on mobile view. I've looked at everything and still cant seem to get rid of it.
I deleted each section of the site hoping to find the area where the issue was (overflowing form something I thought) but it was always there so I don't know what to do.
[link removed] is the site on the dev server.
Im really stumped by this so hope someone can help me. Thanks in advance
The issue is visible only on mobile and almost no way to debug that (well there is a way, kind of a hard way to debug that).
Any long story short ... i suppose one of the page elements is not behaving as it should in mobile view. With this i mean, an element, element X for example is wider then the width of your mobile screen so it creates that white screen issue.
What im gonna propose here is not a 100% solution, is more like a workaround but it will work if the issue is what i supposed:
Apply this css rule on the body tag:
body { overflow-x: hidden; }
http://validator.w3.org/nu/
Copy Paste your url or paste your code (at the "Check by" dropdown) and you'll see unclosed elements.
Close your elements, I think there is the solution
Thanks to everyone for your help. So I found the issue, As Arber suggested it was an element behaving badly. It was the contents of the carousel overflowing causing whitespace to appear, so I was able to rectify the problem. Thanks again! Tthe validation helps with a few other side issues too.

Bootstrap Navbar hover weirdness

Im new. I would love to get some help with why you think this might be happening. Thanks!
So I'm creating a site for a family member's business but the bootstrap nav bar
has some background box when its "active" from ScrollSpy. Please note the background is suppose to be transparent.
Problem
I fixed it! Thank you chrome for being able to temporarily disable css. It was due to Bootstrap's min css file with active modules, in what I couldnt edit due to my css not having it

bootstrap website to wide on IOS

I am having some trouble on this and can not figure it out on my own. I am not any kind of coder just dabbled in it a few times starting in 1998. I am trying to design a website for a friend of mine using bootstrap 3.3.4 for the first time. After getting it online I realized it is way to wide on Iphones. It shows about 50% padding on the right side. You have to zoom in to use view the website correctly. Can anybody give me any input on what can be causing this? I cant find a cause anywhere. On the desktop version it works perfectly even when I resize the window. It is a little to wide on android also but is not near as noticeable as it is on IOS. The website is up at
This link
Thank you for any help
It's difficult to tell exactly what is wrong as I don't have an iPhone. But some observations:
You are loading Boostrap javasript in the head, then loading jQuery and Bootstrap js again at the bottom. Remove the one from headas it's giving a console error.
In the footer, your row has as it's child element a class of col-me-6 which I suspect is a typo. Also it has an inline style of width: 100% which is not advisable - use the grid system to control widths.
Finally, and most likely your problem, in the #portfolio container, your first row has some invalid contents. Only a col-* can be a child of a row. You also have a nested row which is screwing up the margins and giving you the extra wide window.