Background-image

Posted by Helmut_pdorfHelmut_pdorf on 14 Oct 2018 14:44, last edited by Helmut_pdorfHelmut_pdorf on 14 Oct 2018 15:21
Tags: background css

This is a page related to the community question http://community.wikidot.com/forum/t-8001574/background-image-for-single-page#post-4023408

using a local image of the external gallery as a background image for only this page.
( I know, these image is duplicated in div content-wrap, a.s.o, a little bit too much !

But it is important to show that this CSS module works only for this page!

Using following file: http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG from http://community-playground.wikidot.com/image-ext:8 :

SANY1116.JPG

using following local code on this page (showing all "content" possibilities ( using the web-developer tool "Inspector" from Firefox browser - this gives me the names of the "div" - names!:

[[module CSS show="true"]]
#container-wrap {
    background-image: url(http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG);
                   }
/* CONTAINERS
==============================*/
 
#container-wrap {
    background-color: #666A73;
    background-image: url(http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG);
    background-position: top left;
    background-repeat: repeat-y;
    padding: 0 0 0 35px;
}
 
#container {
    background-color: #666A73;
    background-image: url(http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG);
    background-position: top left;
    background-repeat: repeat-y;
    padding: 0 35px 0 0;
}
 
#content-wrap {
    background-color:#ffffff;
    background-image: url(http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG);
    background-position: top left;
    background-repeat: repeat-y;
    border:1px 0 1px solid #AAA;
}
#main-content {
    background-color:#ffffff;
    background-image: url(http://community-playground.wdfiles.com/local--files/gallery-central-storage-area-for-graphics-pictures/SANY1116.JPG);
    background-position: top left;
    background-repeat: repeat-y;
    border:1px 0 1px solid #AAA;
}
[[/module]]

In Action

Have a look on the source code!


Number of Comments: 0)

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License