Firefox Linux (Centos) Responsive Design Image Scaling

Firefox linux (centos) responsive design image scaling

Maybe it will help you. I solved this problem by setting different name for all images. It seems that it helped. Anyway I opened a bug https://bugzilla.mozilla.org/show_bug.cgi?id=975358

Firefox linux (centos) responsive design image scaling

Maybe it will help you. I solved this problem by setting different name for all images. It seems that it helped. Anyway I opened a bug https://bugzilla.mozilla.org/show_bug.cgi?id=975358

Flickering line under background image in Firefox on resize

EDIT:

The issue seems to be related to how FireFox scales the background image. The following seems to fix it for me with FireFox 23.0.1 , OSX 10.8.4

In style.css, try changing the background-size property in the header rule from 100% auto to 99.99% auto, ie

header {
background-image: url("../images/bg-header.jpg");
background-repeat: no-repeat;
background-size: 99.99% auto; 
margin: 0;
overflow: hidden;
padding: 0 2.12766% 35px;
}

---

If I'm understanding your question correctly, check the top of the stylesheet @ http://soundsoups.julie-edwards.com/css/responsive.css

You have

header{
    background-image:url('../images/none.png');
    padding-bottom:15px;
    border-bottom:2px solid #7a918c;
    margin-bottom:20px;     
}  

I think the border-bottom is the cause of the problem.

Good luck!

Resizing background-image always proportionally to scale with a center point

You are looking for this combination:

background-position:50% 50%;  /* Sets reference point to scale from */
background-size:cover;        /* Sets background image to cover entire element */

Working sample fiddle here.

Note that this is not supported by IE8 and will require JS hackery there if you need IE8 or older to be supported.

How to run Firefox full screen in minimalist X environment

We have a similar setup to yours and after a little testing decided to use a tiling window manager instead of just running chrome or firefox in X. A tiling window manager will give you fullscreen regardless of application and many will not have the windows borders/decorations, also great for kiosks.

Xmonad works really well for touch screens; matchbox works well too depending on your use case. Awesome and ratpoison are other good alternatives. You will probably have better luck picking a very minimalist window manager than running directly on X.

http://www.alandmoore.com/blog/2011/11/05/creating-a-kiosk-with-linux-and-x11-2011-edition/

Xmonad has tons of hotkeys which would have to be disabled, so while perfect for touchscreens, may not be suitable for kiosks with keyboards. It does have great configuration documentation and a vibrant community -- but is not a drop-kick solution with keyboard equipped kiosks.

---

Related Topics