hard cssing, removing shadows

  • maria cap

    #1704

    Dear Syahir,

    http://www.marcolongoni.com/

    i’d like to remove the following shadows:

    -under the active menu button (home in the example) – the shadow of the inactive items (servizi, contatti, blog) should remain as is, if possible

    -on the bottom, left and right side of the body – i would like to know if it’s possibile to detach the body from the top of the window, like it’s for the bottom part of the footer.

    finally, i would like to know if there is a “magic” css line that removes all shadows on the site

    thanks a lot in advance and best wishes for your wonderful job!

    Marco Longoni

    CharlieMadsen

    #16927

    Sorry for OT.

    But how did you the navigation bar that color? And how did you make that background?

    Mod

    Kenneth John Odle

    #16928

    -under the active menu button (home in the example) – the shadow of the inactive items (servizi, contatti, blog) should remain as is, if possible</div>

    That shadow is coded like this:

    <div class="menu-bottom-shadow"></div>

    which is generated by a sprite image, so I’m not sure how you would style it without creating your own shadow image and altering the css.

    i would like to know if it’s possibile to detach the body from the top of the window, like it’s for the bottom part of the footer.

    Not sure exactly what you mean by that, but try adding this to your custom css:

    #top-bar {margin-top:25px;}

    a “magic” css line that removes all shadows on the site

    Not that I’m aware of. You’ll have to edit the css file in a text-editor and search for “shadow”.

    Also, you shouldn’t edit theme files directly, since you will lose all your changes in the next theme update. You should create a child theme instead.

    And how did you make that background?

    That’s a simple gradient image, tiled vertically. See this post for a way to do that.

    Ken

    CharlieMadsen

    #16929

    Sorry for stealing the thread.

    @Kenneth

    What should I make the height and width? And how did he change the color of the navigation bar?

    Mod

    Kenneth John Odle

    #16930

    This is the css for the menu bottom shadow:

    .menu-bottom-shadow{
    background: url(images/sprite_h.png) left top repeat-x #eee;
    height: 3px;
    width: 100%;
    }

    You would want to change the height, or eliminate it altogether, to allow the image its own height. Or just leave it. You’ll need to play around a bit to get the exact look you want. The content area is 960 pixels, so make your image 960px wide.

    The navigation bar: there’s been a lot of discussion about that here. Search around a bit and I’m sure you’ll find what you’re looking for. If you take a look at the stylesheet, the navigation styles begin on line 204. Take a look at this post to see how I effected a minor change to the menu. You can also take a look at this post for something a bit more complicated.

    Good luck,

    Ken

    marcolongoni

    #16931

    It is

    Code:
    #top-bar {margin-top:25px;}
    #header {margin-top:25px;}

    to ensure detachment even if top-bar is hidden in theme options.

    Still having some trouble in removing the main frame shadows (top of the header, left and right of the body, bottom of the footer)

    Anonymous

    #16932

    Hi marcolongoni, I’m new here and certainly not a CSS expert, but I, too, wanted to remove the shadows from my blog. I managed to find a way, and it’s very easy!

    If you do a ctrl-f search for “shadow” on the Editor text (style.css), the first thing you get to is this:

    #container {
    -webkit-box-shadow: 0 0 10px #000;
    box-shadow: 0 0 10px #000;
    margin: 0px auto;
    width: 960px;

    This is the one you need! Simply replace the two “10px” with “0px” and voila! No more shadows! BUT instead of modifying the code directly you should go to Graphene Options > Display > Custom CSS and paste the code there (with the modifications, obviously!). It works the same. OR, you can make a child theme, but I don’t know much about that, if it’s better, or worse (or the same) than using the Custom CSS… 🙂 Hope this helps!

Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.
Do NOT follow this link or you will be banned from the site!