tabs/menu dropdown position not working - html

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

Related

Website sticks out of the window on mobile

it's been few hours that I am looking for the answer to my problem and I am starting to desesperate. I hope you could help me !
I am developping a personal website and I am working on the responsive. I don't know why, but on mobile, I can horizontally scroll, the body (or whatever this is) sticks out of the window. I've tried to place some box-sizing : border-box because I thought it would resolve it then I check 2x times my entirely code, trying to delete or add some elements but still no good result.
Given that I don't know where the problem is, I think it is easier if I provide you the url : right here. (Use the web developer mode of your browser to see the website on a mobile way so you can see my problem)
Hope you can help me, I haven't any other idea of what to do...
Thanks !

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.

Dropdown lists and button appears to be disabled (not working) resizing the browser

I have a strange behavior with drop down lists and button in my layout.
I have just made a fiddle here to illustrate how this looks like.
As you can see in the example, if you resize the browser the you can still open the lists or click on the Filter button which is ok.
When I do the same on my desktop, the first list will work properly, but the second and third list will not open as well the button in not clickable anymore.
I have spent the all day trying to fix this issue, unfortunately with no success at all.
Maybe someone of you guys have had the same issue or knows what is going on here?
Any help will be much appreciated.
I've encountered issue like that before when wrapper elements were stretching over other elements via zindex and couldn't track it down until i gave each element a background color and could see how they were transforming in size as i adjusted the window size.

Sidebar won't sit right - shifted to bottom right

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.

list based menu is flowing the the next line when zoomed in or out

Hi
I am trying to make a site with list based menu. It look the way I want but as soon as I zoom in or out the menu flows to the newt row. It's happening in every browser (but at different zoom levels.)
I have found few similar topics on this forum and tried using those solution. But nothing seem to be working.
You could have a look at the website yourself at www.empoise.com (the upper menu).
If you need any other info please let me know.
I have been trying to resolve it for last many months!
I would greatly appreciate any help.
Thank you
T
why don't you try this:
.span-13 {width:200px;}
.span-11 {width:730px;float:right;}
#header #menu {float:right;margin:0;padding:0;}