Image covering Form in Mobile Site - css

I have a responsive site that has an image next to a form. My problem is that when the screen shrinks the image covers the form. I would like it so that the form covers the image. I have tried changing the Z-Index but it doesn't seem to work. You can see examples of my problem here: http://inventivewebdesign.com/uctest/?page_id=45
Thanks in advance for your help!

I looked at it and just used CSS to make the specific div for this specific page to change the width when the screen shrinks, works fine now. Thanks for your ideas.

Related

Elementor: dynamic content on fixed background

My problem: I want to have the content of my page as it is on the https://little-lime.de/ website. So I want the content to be changed when the user just scrolls a little bit while the background stays the same. Is there any Elementor plugin for doing this? Or any other solutions for this?
And the second (less important question): How can I create an background like the one of the mentioned website (https://little-lime.de/) where the points in the background always connect with the mouse?
Hopefully you understand my questions/problems and can halp me.
Thanks in advance!

Body's background image covers part of header's background image in mobile version

This is my first attempt to make a webpage but something seems to go wrong with the mobile version of my page. On desktop everything is ok but on mobile, the right part of my header's background img is covered by the main background image.It is a little difficult to describe it so I 'm sending you the link for your better understanding http://rockittest.blogspot.gr/.
I tried to resize the images, to change position, I've read all relevant threads but I couldn't fix it. Do you have any ideas about what can be wrong?
Thank you in advance!

mobile navigation doesn't fix on scrolling

I'm working for a responsive website on a slider like FB App. It works fine, but if the user scrolls, the open navigation moves with the content. I'm trying to put position: fixed to the element. This works,but if the navigation element is larger than the screen the rest of the content cannot reached. Example: http://lucie-hauri.com.beethoven.ch-meta.net/ (just put the screen to a width of about 300px an the mobile Icon appears, click on it for example).
Has anyone an idea how to fix this?
Thanks for help, regards
Thomas
I don't know if this is the cause, but you have a javascript error (check the console), which may break things up.

right scroll bar appearing and need to remove it

I'm a newbie and need to remove the scroll bar at the bottom of this website.
I also need the body to be centered.
http://selfcateringholidaycottagecornwall.seesites.biz/
Many thanks
First: what screen size are you on?
The reason that you get a scrollbar at the bottom of the page probably is because your screen resolution is low.
When I go to your link, I don't have a scrollbar (this is at screen resolution: 1920x1080 and with Firefox 28.0).
A possible solution is to use the max-width: attribute to your 's to prevent your website from being too large.
Is this what you mean? If not, could you clarify your problem?

center site content on all devices

This is the site I am referring to: http://heattreatforum.flyten.net/
It was built as a child-site to the twenty-twelve theme.
I can't seem to get the content to center on every screen, and I am seeing a strange wide margin on the right that I just can't seem to locate in my css.
Any help would be much appreciated - thanks for looking!
The problem is that your div having id my-name has min-width: 1510px;. Delete it and all your problems will disappear.

Resources