Solved

Why is the main content area appear to be "wider" on these two templates in Firefox

Posted on 2014-03-01
9
181 Views
Last Modified: 2014-03-02
Hello

I have two templates that look okay in Chrome (windows), but in Firefox they fill the screen quite differently.

In my next comment I'll give you the links.

The css appears to be the same.  But obviously it is not the same.

Looking for a CSS expert to solve the mystery!

Thanks

Rowby
0
Comment
Question by:Rowby Goren
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
9 Comments
 
LVL 9

Author Comment

by:Rowby Goren
ID: 39897857
Okay!

Here's the two links.  Again they look ok in Chrome, but in Firefox (windows) there is a considerable difference in Firefox.  BTW my computer's screen resolution is 1600 x 900.

appears not as wide on the screen in Firefox
Appears "wider" in firefox

It appears that the width is controlled by container-fluid inner   But I think other issues may come into play here.

Any thoughts?

Thanks

Rowby
0
 
LVL 35

Expert Comment

by:Dan Craciun
ID: 39897864
I don't see the difference here (win 8.1). See the picture.
comparisonHTH,
Dan
0
 
LVL 25

Assisted Solution

by:Kyle Hamilton
Kyle Hamilton earned 50 total points
ID: 39897878
they look the same to me. though i can only look at the windows FF version in browserstack, and the window size option only goes up to 1280 wide.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 9

Author Comment

by:Rowby Goren
ID: 39897971
Hmmm.....   I will look at it in browserstack.

But the issue was pointed out to me by someone at the university -- and we saw that issue on his firefox browser there.

And see it on my local laptop.  Windows 8.1 Hmmmmm....

I'll check browserstack a little later on.

Thanks Kyle!  

I'll also do a screen shot on my local computer, etc.

Rowby
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 39897998
Here are screen shots of the two different university departments on my windows computer -- both in firefox.
picture018.jpg
picture017.jpg
0
 
LVL 35

Accepted Solution

by:
Dan Craciun earned 450 total points
ID: 39898190
Looks like someone pressed Ctrl+ on one of the examples.
That page is zoomed. Either by accident (holding Ctrl while playing with the mouse wheel) or trying to read it better.

Restore the zoom to 100% and it will look the same as Chrome.

HTH,
Dan
0
 
LVL 9

Author Comment

by:Rowby Goren
ID: 39898243
Hmmm.....

Is there a css or Javascript command that will force browser to 100 percent zoom?
0
 
LVL 35

Expert Comment

by:Dan Craciun
ID: 39898274
Don't think so. You (or someone else) manually zoomed in. It's an accessibility helper.

If you could undo that programatically, then the people who need to zoom in to read your page would be pretty upset...

Just press Ctrl- until the zoom is at 100%
0
 
LVL 9

Author Closing Comment

by:Rowby Goren
ID: 39898664
Hi Dan,

This is very funny.  I've gone nuts trying to figure out why this was happening.  I've looked at the code, removed the background image etc

And the "solution" was indeed just the zoom.  Which explains why I have had problems trying to recreate the problem.  It was so inconsistent.

Indeed Ctrl - got me to 100% zoom and all pages look the same.

Thanks to you and Experts Exchange for resolving this!

Rowby
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to format numbers and letters in nested lists 5 53
email validation 9 63
Make Float not to Wrap 15 66
Best explanation of following code css 11 40
When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question