troubleshooting Question

Different behaviour between Firefox and Chrome using relative position CSS

Avatar of DanielAttard
DanielAttardFlag for Canada asked on
CSSWeb DevelopmentHTML
11 Comments1 Solution838 ViewsLast Modified:
I need some help to try and develop a workaround for a CSS problem I am having.  My problem is that I have some code that works perfectly in Firefox, but the page renders slightly differently in Chrome and Safari and causes a problem.

Difficult to explain my problem, but I will try.  I have a div called #pageoptions and it displays perfectly fine in Firefox.

Here is the CSS:

#pageoptions {
position: relative;
overflow: hidden;
width: auto;
padding: 0;
min-height: 20px;

For some reason, when I begin typing in a certain input box in Chrome, it causes this div move and become partly visible.  When I do the same thing in Firefox, the div does not move at all and remains put as it should.

I know this is not a very good description, but hopefully it is enough to give you an idea of where I am stuck.  Any ideas would be appreciated.

Our community of experts have been thoroughly vetted for their expertise and industry experience.

Join our community to see this answer!
Unlock 1 Answer and 11 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 1 Answer and 11 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros