html - How to set a shadow on a two panels page, regardless of its height? -

-

i have found answer, not sure best approach problem. page has 2 panels: 1 sidebar , 1 content view. want have shadow on sidebar if content view producing it:

sidebar , content view

the problem sidebar menu buttons, icons, etc. if try set (inset) shadow there:

.sidebar {     box-shadow: inset -7px 0 9px -7px rgba(0,0,0,0.7); }

i get:

enter image description here

so, have buttons, hide shadow. if other way content view produces it:

.content {     box-shadow: -7px 0 9px -7px rgba(0,0,0,0.7); }

i shadow along content, if content "shorter" total height of screen, shadow disappears. similar previous case.

my final approach set manual height content view or javascript, adapt viewport height. not sure best way it. know if there more css way it, without having set things manually or getting shadows cut.

edit

while creating fiddle better understanding problem realized had background-color on buttons. since have hover , transition on button, still hides shadow. check out: http://jsfiddle.net/h3cp59qd/

check out: http://jsfiddle.net/h3cp59qd/3/

use position:absolute both sidebar , content:

body, html {     background: #d8d8d8;     height: 100%;     margin: 0;     padding: 0; }  #app {     width: 100%;     height: 100%;     position: relative; }  #sidebar {     width: 20%;     z-index: 1;     position: absolute;     top: 0;     bottom: 0;     background: #c8c8c8; }  #sidebar ul {     list-style-type: none;     margin: 0;     padding: 0; }  #sidebar ul li {     padding-left: 20px;     height: 60px;     text-transform: uppercase;     color: white;     font-weight: 900;     font-size: 12pt;     line-height: 60px;     vertical-align: middle; }  #sidebar ul li:hover {     background: #c0c0c0;      color: #eee; }  #content {     width: 80%;     position: absolute;     z-index: 100;     left: 20%;     top: 0;     bottom: 0;     padding: 0 50px;     box-shadow: -7px 0 9px -7px rgba(0,0,0,0.7); }

Comments

Post a Comment

Popular posts from this blog

python - pip install -U PySide error -

-
does know how avoid following error when running pip install -u pyside per official website instructions here: https://pypi.python.org/pypi/pyside/#installing-pyside-on-a-mac-os-x-system note have done brew install qt successfully. you using pip version 7.0.3, version 7.1.2 available. should consider upgrading via 'pip install --upgrade pip' command. collecting pyside using cached pyside-1.2.4.tar.gz installing collected packages: pyside running setup.py install pyside complete output command /applications/anaconda/bin/python -c "import setuptools, tokenize;__file__='/private/var/folders/dy/ttgqhqqx3g9bsbsnqnxsk2z80000gq/t/pip-build-cpxemt/pyside/setup.py';exec(compile(getattr(tokenize, 'open', open)(__file__).read().replace('\r\n', '\n'), __file__, 'exec'))" install --record /var/folders/dy/ttgqhqqx3g9bsbsnqnxsk2z80000gq/t/pip-0r7hri-record/install-record.txt --single-version-externally-managed --compile: ...
Read more

arrays - C++ error: a brace-enclosed initializer is not allowed here before ‘{’ token -

-
simple question: i'm trying initialize array within c++ class declaration: using namespace std; #include <string> class myclass{ public: string myarray[] = {"a","b","c"}; }; and i'm getting error: error: brace-enclosed initializer not allowed here before ‘{’ token no, without complied c++11 compiler, cannot initialize member array in declaration. have initialize array member in constructor. , don't use open array if know number of elements initialize array.
Read more

apache - setting document root in antoher partition on ubuntu -

-
i place apache document root inside partition of ubuntu hard drive, keep getting forbidden message, when place home directory woking find, how be? group or owner affected ? here mysite.conf , apache2.conf when place document root in home folder (working) #site-available/mysite.conf documentroot /home/jono/www #/etc/apache2/apache2.conf <directory /home/jono/www/> options indexes followsymlinks allowoverride none require granted </directory> bu when change document root partition keep getting forbidden messasge #site-available/mysite.conf documentroot /media/jono/website_data/www #/etc/apache2/apache2.conf <directory /media/jono/website_data/www/> options indexes followsymlinks allowoverride none require granted </directory> is owner/group access affected ? or there problem ? at last it's working, have grant access www:data accesing whole directory @mark-b, using chown -r www-data:www-data whole directory is...
Read more