Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #12584

    Hi,

    how can i add a gradient to the border of my site ?

    #76019

    The border where? Around the entire page? First have to create the image.The define where the image is. Just a theory.

    Do you use Firebug? You should try it.

    I think this is the code that applies:

    * #Base 960 Grid

    ================================================== */

    #wrap_all { margin: 0 auto; position:relative; z-index: 3; }

    .boxed #wrap_all { margin: 0 auto; width: 990px; /* -moz-box-shadow: 0 0 5px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3); box-shadow: 0 0 5px rgba(0,0,0,0.3); */}

    .container { position: relative; width: 930px; margin: 0 auto; padding: 0px 30px; clear:both; overflow: hidden;}

    .container_wrap { clear:both; }

    .unit, .units { float: left; display: inline; margin-left: 30px; position:relative; z-index:1; }

    .row { position:relative; margin-bottom: 20px; clear:both; }

    .stretch_full { position:relative; left:-30px; }

    #76020

    thx but this doesnt work…i meant a code like this:

    .boxed #wrap_all {

    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.6);

    margin: 30px auto;

    }

    but here the shadow goes over the top.

    #76021

    You would have to upload your gradient image. Copy the URL and put that into the code so it would know the location.

    I just pasted in the entire code from the style sheet.

    What I see you have there is the shadow..how wide it is and probably the density of the shadow. You would have to experiment with a gradient image. Though I am not sure you would see much gradient is a small shadow. You could also try just changing the color code for a different effect

    #76022

    yes i mean a shadow…sorry for bad english. here u can see that the shadow goes too much to the top.

    but the look is good. it would be perfect if the shadow is only at the box, not above.

    http://www.martinaundchristoph.de/

    #76023

    What you are referring to is this:

    The meta header:You have removed the contact box that was their in the original set up. So If you still want it there, you can change the height. Experiment with what you think looks good, or you could display: none} I think? Worth a try.

    Is this for YOUR wedding? Very nice

    #meta_header, #top #meta_header .container{

    position: relative;

    z-index: 101;

    background:transparent;

    height:60px;

    }

    #76024

    no its not for me … its for a customer. im his agency :)

    the code doesnt work :( but thx for helping me :)

    i want only a little shadow to my box

    #76025

    This is the code for the shadow around it all:

    You have to adjust to suit your needs.

    .boxed #wrap_all {

    box-shadow: 0 3px 14px

    rgba(0, 0, 0, 0.8);

    margin: 0px auto;

    }

    But to me, it still looks like you still have to remove that large empty area at the top of your page.

    #76026

    yes, the shadow goes over it. i dont know how to do that :)

    #76027

    Try putting this in the QUICK STYLES area and see what happens

    #meta_header, #top #meta_header .container{

    position: relative;

    z-index: 101;

    background:transparent;

    height:0px;

    }

    #76028

    yeah thx, now its ok, but the top space is gone…the site box is now on the top. nothing other solutions ? if not i use this code.

    #76029

    Hi ak-muc,

    I’m not quite sure what your’re still looking to have happen at this point. If you can give a bit more detail, maybe we can help with a bit of css tweaking.

    Regards,

    Devin

    #76030

    Well try making the height something different and see how it looks,,,instead of 0 try 5 or 10

    #meta_header, #top #meta_header .container {

    position: relative;

    z-index: 101;

    background:

    transparent;

    height: 10px;

    }

    #76031

    its ok, thx for help.

    i cant explain it in english.

    ich wollte einfach nur nen schatten haben, der um meine seite läuft wie hier zu sehen.

    http://www.schumanns-weinblog.de/

    nur dass er eben nicht nach oben weiterläuft und an den weissen ausgesparten stellen nach innen geht.

    im link oben geht der schatten nur am rand entlang nach oben.

    :)

    schwierig zu erklären aber halb so wild wenns nicht geht…danke trotzdem :)

    in corona gehts gut wie hier zu sehen, aber hier ist die “box” (contentbereich) auch druchgehend:

    http://www.richter-kiehn.de/

    #76032

    Try this:

    #meta_header, #top #meta_header .container {

    position: relative;

    z-index: 101;

    background:

    transparent;

    height: 60px;

    }

    #76033

    Thanks for helping out elames! You rock! Let us know how that works for you ak-muc.

    Regards,

    Mya

    #76034

    thx, but this code doesnt change anything. its ok and not very important for me. i dont put the shadow in it.

    with corona it works nicely…to see here: http://www.richter-kiehn.de

    this shadow i want to have in coherence :)

    #76035

    I think you need to push the container down a bit – otherwise you won’t see the shadow on the top/bottom. Add following css code to css/custom.css or the quick css field:

    .boxed #wrap_all {
    margin: 20px auto
    }

    #76036

    yes … cool, but here u can see what i mean…

    the shadow goes straight to the top. it doesnt go around the content box.

    http://www.martinaundchristoph.de/

    #76037

    Hi ak-muc,

    Try adding the following CSS to your Quick CSS (located under the Styling Tab in the theme options) or the custom.css file in the css folder of your theme files:

    #meta_header, #top #meta_header .container {
    box-shadow: none;
    }
    .container_wrap {
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.8);
    }

    Regards,

    Devin

    #76038

    ok thx, code is in and looks like this, but nothing changed. its ok if i cant get fixed. i dont wanna waste ur time with it :)

    #socket .container { display:none; }

    .main_menu {

    top: 70%;

    }

    .main_menu .menu ul {

    padding-top: 10px;

    }

    #top .comment-reply-link {

    left: -95px;

    }

    .commentlist .gravatar {

    left: -10px;

    }

    .comment_content{

    left:30px;

    }

    .title_container h1 {

    margin: 0;

    font-size: 12px;

    position: relative;

    z-index: 2;

    }

    .title_container{

    display: none;

    }

    #footer .container { display:none; }

    #meta_header, #top #meta_header .container {

    position: relative;

    z-index: 101;

    background:

    transparent;

    height: 60px;

    }

    .boxed #wrap_all {

    margin: 20px auto

    }

    .boxed #wrap_all {

    box-shadow: 0 3px 14px

    rgba(0, 0, 0, 0.8);

    margin: 0px auto;

    }

    #meta_header, #top #meta_header .container {

    box-shadow: none;

    }

    .container_wrap {

    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.8);

    }

    #76039

    Hello,

    I’m out of ideas if that one didn’t work then. You can remove the css I provided then if its not making any change for you as well as the others provided above. That way you don’t get any other complications from overlapping issues later on.

    Regards,

    Devin

    #76040

    ok thank you…that what i try to do is a border around my page like here to see:

    http://www.staudacher-arbeitsrecht.de/de/kst-impressum.php

    i mean the blur/gradient/shadow around the content box.

    #76041

    Hi ak-muc,

    I believe we all understand what you are looking for but have no other suggestions on how to achieve the effect. If you would like to look into it further, I would recommend hiring a freelance web developer who can make the customization for you.

    Regards,

    Devin

Viewing 24 posts - 1 through 24 (of 24 total)

The topic ‘Gradient to Border’ is closed to new replies.