I can't change my page background (foundation 5)

I use Foundation 5 platform to build my website.

In one of the pages in my website, there is a blank white background - the default one. I tried to change it into an image background, but failed to.

I am adding the code I tried to add to one of my pages' header. Does anyone know why the background stays white? Thank your!!

<style>
    html { 
      background: url(images/bg.jpg) no-repeat center center fixed; 
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }
</style>

Answers


It's not exactly clear from the amount of information you provided. I'm guessing it is either that the browser cannot find images/bg.jpg relative to the path of this HTML file or there is a conflict between CSS declarations. You could try applying this CSS to the body element instead of the html element. It could also be that another CSS selector has higher precedence and therefore applies instead of this one.

One way to find out is to use your browser's inspector tool. For example, in Chrome, right-click and select "Inspect Element", in the Elements tab, click on the <html> element and then check out the styles that are active for it (right-hand Styles pane).


The problem you are having is because the body background has been set to white by default in foundation.

Uncomment and edit line 38 of _settings.scss file from

 // $body-bg: #fff;

to

 $body-bg: transparent;

Need Your Help

WinRTXamlCalendar : how to change width?

windows-store-apps winrt-xaml winrt-xaml-toolkit

I'm working on a Windows 8 app (Windows Store App) and i need to integrate a customisable calendar control.

How do you close an application when some WaitHandle is in the middle of a call to WaitOne?

c# multithreading idisposable shutdown waithandle

Is there a standard way to close out an application "cleanly" while some WaitHandle objects may be in the state of a current blocking call to WaitOne?