Sidebar padding issue when reducing width in responsive theme.

Community Forums Forums Design Tips and Tricks Sidebar padding issue when reducing width in responsive theme.

This topic is: resolved

Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  MrZaradax 1 year, 7 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #7755

    MrZaradax
    Participant
    Post count: 7

    Hi all,

    I am in the process of customizing the Mindstream responsive theme design for use at http://www.lizziekphotography.com

    I have changed the background color for the right sidebar widget areas using the following CSS.

    .sidebar .widget {
    -moz-box-shadow: 0 0 5px #222 inset;
    -webkit-box-shadow: 0 0 5px #222 inset;
    box-shadow: 0 0 5px #FFCCFF inset;
    margin: 15px 0 0;
    overflow: hidden;
    padding: 15px 20px;
    background-color: #FFEEFF;
    }

    This looks all ok in full width mode, but when viewed in either reduced width or on a mobile device, the padding (padding: 15px 20px;) reveals a background closer to #333. I can’t for the life of me, correct it!

    Any assistance would be greatly appreciated!

    Thanks

    • This topic was modified 1 year, 7 months ago by  MrZaradax.
    • This topic was modified 1 year, 7 months ago by  MrZaradax.
    • This topic was modified 1 year, 7 months ago by  MrZaradax.
    • This topic was modified 1 year, 7 months ago by  MrZaradax.
    #7758

    Riavon
    Participant
    Post count: 95

    Hi, the color is generated by this:

    .content-sidebar #sidebar .widget, .sidebar-content #sidebar .widget, #footer, #header {

        background: none repeat scroll 0 0 #222222;

    }

    on line 1547 of your style sheet. Simply change that #222222 to your pink color or transparent.


    Twitter: @riavonentprises

    #7764

    MrZaradax
    Participant
    Post count: 7

    Thank you sooooo very much Riavon!

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

You must be logged in to reply to this topic.