Youtube full screen shows under the Wordpress layout elements (Chrome only) - wordpress

Youtube full screen shows under the Wordpress layout elements like menu and footer (Google Chrome browser only).
How can i fix this?

Related

My WordPress website logo fits properly in desktop PC but does not fit properly in responsive and desktop view from mobile

My WordPress website logo fits properly in desktop PC but when open website in mobile using Google Chrome or any browser with desktop view logo and menu bar does not fit properly?
responsive mode ok but logo do not fit properly
in mobile desktop view logo and menubar does not fit properly
when css is removed it looks almost fine.... but when i updated logo and navigation part css it gets issue

Links are disabled on mobile

I can't click on any building pictures links (at the very bottom of the homepage) when going on mobile a this project whatever safari, chrome or firefox (while it's working well on desktop) :
here is the concerned building pictures links
Do you have any ideas of how I can fix that ?
Thanks for your help !
I can click them on an iPhone 8 with Chrome Browser.
But i can only click them outside of the colored border. So the colored border is above the image which contains the link.
Check the z-index property and the media queries. You will see, that the border is above the image on mobile devices and below the image on desktop screens.

Vimeo in lightbox - fullscreen not working in chrome

I am experiencing an issue in chrome. I am using a wordpress plugin to popup a vimeo embed. Everything looks perfect, except for when you click the full screen icon in the vimeo controls.
The page jumps to full screen but you can only see about a quarter of the video in the top left corner of the browser, on top of the page content that should be hidden by the full screen video.
Please advise!
Resolved. There was an unsupported issue with the plugin I was using. #wpproblems

Mobile CSS is The Only CSS Showing... Even on Desktop

So I made a website which has two CSS files; one is for regular desktop computers, and one is for mobile devices with a max width of 480px. Something happened while I was editing my website, and now the mobile version is the only CSS that shows.
I have two CSS' linked in my header, both the mobile CSS and regular (desktop) CSS. When I remove the mobile css link, the desktop version of the website shows like it should. However, when the mobile css stylesheet link is in place, only the mobile website is what shows on both desktop and mobile devices.
When you go onto my website on a laptop, the whole page is shoved to the left, and it is only 480px wide. Any idea what is up?
I figured it out. There was a wordpress plugin called "Above the Fold" which was the problem. I had to link the CSS in the footer.

Targeting mobile menu in Wordpress

Is there a way to target css to the mobile menu only? I am using http://athemes.com/theme/Sydney and my dev server is at http://150.101.201.63/wordpress2/WordPress/
Simply put when the menu changes to the mobile menu (one with single button to open menu versus top navigation menu) I want to add some styling. I used to do this by device width but I'm finding this less effective with this theme.
Any help appreciated.
Resize your desktop window to actuate the mobile display of your site and use a web inspector tool in your browser to find the element you'd like to change.
Your Dev site is broken, but Renovation Princess uses the element #respo-menu-list-left to effect portions of your mobile menu.
I tried/guessed it and the url is http://150.101.201.63/wordpress2/wordpress/, so now uppercase in wordpress.
I looked in over the website and when it displays the mobile menu it changes the menu id to mainnav-mobi, so you can safely write you css for that id and it will only show on mobile.
#mainnav-mobi {
/* css here */
}

Resources