Sidebar won't sit right - shifted to bottom right - html

Just doing a bit of coding and everything was fine and now suddenly when I change something not related to the sidebar at all the sidebar decides to move, I can't seem tow work out a reason why it would though.
The code is quite long so I'll just post a link to the page:
Here
Can someone help me explain why it suddenly moved to a weird position? Might be because I plonked a program on the page and didn't format it very well, any helps greatly appreciated :)

The floating sidebar div has to go before the content div in your HTML Code.

Related

tabs/menu dropdown position not working

I am sorry in advance I could not get this to work in jsfiddle. I really am just not sure how to do it and I've spent way too long trying to figure it out.
Anyway I have this zozo tab (which no longer offers support) I am using HERE, When I make the window small for mobile size and click the "Overview" link that entire drop down menu goes under so there seems to be two "Overviews" instead of on top of it. Can someone please help me figure this out? I would great appreciate it!
CSS her HERE and HERE
JS for tabs is HERE

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.

Image pushing content off page

Here is my site: http://www.requitedesigns.com/seele/
To see the problem, you'd have to load up the site in Chrome or FF responsive mode, say the iPhone responsive mode. Scroll to the bottom. You should see the bottom of the page where the copyright is, is not quite there. It's as if it hangs up somewhere around Featured Author or Featured Video.
The reason seems to be the coloumn image, in the middle of the page, the one next to "Ultimate Shortcodes". If I hide that image by removing it's height (set by the matchHeight JS library), I can then see the content at the bottom of that page. But, restore that image height, and the content gets pushed down off screen? I must be missing something. I can't figure out why that happens. I tried disabling all the overflow CSS, to no avail. Is there a CSS guru out there who can point me in the correct direction?
Thanks!
I added a min-height css, seemed to fix it. Not sure why. Oh well. Sorry I could not duplicate an ENTIRE SITE for most of you chaps.

CSS-Menu jumps when clicked on

I'm working on the following project and I'm having a small problem with my entire page shifting about 5-10px when the page content goes beyond a certain lenght.
http://www.thewaymultimedia.com/IML/
I'm not sure what I"m missing, I've spent the past couple of hours looking at my CSS to see if I have an extra padding or margin but I cant narrow it down. Anyone a pro at CSS familiar with this problem.
If you go in the about menu and then click on 'board of directors" menu and you will see what i mean. If i reduce the content it will stop, but this page will require quite of bit of vertical real state.
Any suggestions. The website is using WordPress by the way
Is it possibly because it is going beyond the length of the window and is, therefore, needing a scroll bar?
That is due to the scrollbar...

How can I get rid of the blank space under the website?

OK, so im working on this website for a friend. The homepage looks pretty good but im having a problem with the 4 pages that are linked at the top. Every time I click on them and they load but there is a big blank space at the bottom of the page. Its not a huge deal but I think it looks funny. Anyone have any idea whats wrong with it? Did I mess up a line of code (probably), and if so, where would that line of code be?
I want the page to stretch all the way to the bottom of the browser windows. Any help would be great, even if you can just point me in the right direction. Thanks!
You should try changing the main table's height from 86% to 100%.