Learn More





Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...CSS with minus Z-index not working - Help NeededCSS with minus Z-index not working - Help Needed
New Post
10/25/2013 10:39 PM
I'm using a div with an :after shadow assigned and it only renders when logged into the Admin?


Specifically I would like to have a gradient shadow on a div and the way to normally get that affect is to use a div:before and or div:after CSS with the gradient rounding etc. The problem is this also requires a z-index: -1; and this will render for me when I'm logged in as admin but not as a normal website viewer. This is a normal way to generate these effects used everyday in CSS there must be a work around. 

This article shows me that everything including content stops at z-index zero. > 

With all the websites being designed with CSS3 there must be a work around for this???  


New Post
10/26/2013 9:59 AM
If the div have an inline z-index you have to use the !important Attribut to override them. Otherwise please post your complete CSS Attributes of the css class.
New Post
10/26/2013 2:08 PM

Yes, thank you I have tried that.

Below is the CSS. What I don't understand is why when I login to Admin to edit the page content the CSS is visible, but when I view the page not as admin the CSS does not render in the browser? I cannot narrow down the z-depth issue. Here is a link to the page with the CSS assigned to it. > test page  

.panelHeader03 {
    background: none repeat scroll 0 0 #FFFFFF;
    height: 100px;
    left: 0;
    margin-top: -40px;
    position: absolute;
    width: 100%;
z-index: 50;

.panelHeader03:after {
    border-radius: 47% 47% 47% 47%;
    -webkit-box-shadow: 0 60px 16px rgba(0, 0, 0, 0.7);
    box-shadow: 0 60px 16px rgba(0, 0, 0, 0.7);
    content: "";
    height: 20px;
    left: 2%;
    min-width: 300px;
    position: absolute;
    top: 14px;
    width: 96%;
    z-index: -1!important;

New Post
10/27/2013 8:01 AM

I have to look but think only using the web-kit is not enough but I have to look into documentations of css.

For your index issue you have to ad a space use:  z-index: -1 !important;

New Post
10/27/2013 8:08 AM

I think for the boarders you have to use px and not persent.  also you have to add the webkit part eg:

-webkit-border-radius: 50px;
border-radius: 50px;

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...CSS with minus Z-index not working - Help NeededCSS with minus Z-index not working - Help Needed

These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

  1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
  2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
  3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
  4. No Flaming or Trolling.
  5. No Profanity, Racism, or Prejudice.
  6. Site Moderators have the final word on approving / removing a thread or post or comment.
  7. English language posting only, please.
Try Evoq
For Free
Start Free Trial
a Demo
See Evoq Live
Need More Information?