Widget Borders

  • lateatlantean

    #5238

    Hello again!

    I have checked the support forums and did my best to figure this out using Firebug, but I need help please.

    I want to be able to have line type borders around widget boxes. I have been able to do this with this and can edit colors:

    .sidebar div.sidebar-wrap {
    box-shadow: .5px 2px .5px 1px

    However, I don’t want lines around all of my widget boxes. Some would look good with just an outside border line. Some I kind of like with just an L type line and underline, etc. , but when I adjust the box-shadow (as shown above)…sidebars do not mirror…instead 1 and 2 are like L L. Does that make sense?

    With ads in widget areas, I don’t want to have any lines around the widget box.

    I think I need to target the specific container and grid for each? I haven’t been able to figure out how to write the code properly. I

    Can anyone please give me an example of how the code should look to do this kind of customizing?

    I do have a static front page…so would the target code be different for those widget areas (like the widget area is front page sidebar widget area 1 and 2, etc.)?

    Please forgive me if I am not wording things properly or not clear…I am very tired from trying to get this to work.

    Oh, yes, I am using a child theme. 🙂 Thank you for the template Parsanna! It was a blessing!

    Thanks to all of you and your wonderful support!

    ronangelo

    #31252

    You just replace the .sidebar div.sidebar-wrap with the specific ID that you see in firebug.

    for example: if you used a text widget then you use firebug and see something like

    <div id="text-10" class="sidebar-wrap clearfix widget_text">

    your code should be something like this.

    #text-10 {
    border: 1px solid #000;
    }

    can you post your url.

    lateatlantean

    #31253

    Wow! That was fast! Thank you…

    Here is my url….kinda sucks right now…any suggestions would be great…you just have to give me instructions too. lol.

    I’ll take it out of maintenance mode so you can look at it. Be gentle, it’s my first time. 🙂 Been fighting with colors..look good on one page but not on the others….I guess I’ll get it eventually.

    Here ya go, and thanks so much!

    http://www.gethealthcareonline.com

    lateatlantean

    #31254

    Can I adjust the border in radius? Like 0 0 0 0px going clockwise for left top right and bottom? Or…?

    lateatlantean

    #31255

    Oh…sorry, I’m using Ad Codes and Jetpack Image widgets mostly.

    Mod

    Kenneth John Odle

    #31256
    Quote:
    Can I adjust the border in radius? Like 0 0 0 0px going clockwise for left top right and bottom?

    Yes. See this:

    http://www.w3schools.com/cssref/css3_pr_border-radius.asp

    lateatlantean

    #31257

    This formula worked! Thanks guys for your help and links!

    }
    #ws_widget__ad_codes-27{
    box-shadow: 0 0 0;
    box-border: 0 0 0;
    }
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!