resize widget margin (responsive)

  • Resolved kamaradski

    (@kamaradski)


    10 years, 1 month ago

    Hi all,

    I have adjusted the width of my blog:

    #container {
max-width: 75%;
}

    and since my widgets also stretched i try to decrease this to:

    #widgets {
max-width: 20%;
margin-right: 10px;
}

    However the margin on the right is still way off. Could someone point me into the right direction on how to resize this properly ?

    https://kamaradski.com

    KR
    Willem

Viewing 4 replies - 1 through 4 (of 4 total)

  • I’m not 100% sure what you’re looking to do. I’m not sure what you mean by “still way off.” Do you mean you want the sidebar to show more to the right? If so, just add:

    Margin-left: 90px !important;

    to the #widgets{ area. You can play with the 90px till it looks like you want.

    Thread Starter kamaradski

    (@kamaradski)

    Hi Augustin56,

    That did the trick very nicely ?? However now it broke the responsiveness..

    Is there a way to move the widget bar to the right based on percentage ? (like with “max-width: xx%”)

    I managed to shrink the blog area with:

    #content-blog {
max-width: xx%;
}

    But i cannot get it to increase all the way up to 77% where i want it to be. Maybe some other element i overlook will need shrinking first ?

    CSS is not any of my skills unfortunately.

    Thread Starter kamaradski

    (@kamaradski)

    I figured it out ?? yay to me! lol

    The theme builders had a core-css file hidden, with the .col-620 value set to width 65.something%.

    Once overwritten this gave the desired effect.

    For future reference of other people with the same problem here is my full child CSS file:

    #container {
max-width: 75%;
}

#footer {
max-width: 75%;
}

#widgets {
max-width: 20%;
}

.col-60,
.col-140,
.col-220,
.col-300,
.col-380,
.col-460,
.col-540,
.col-620,
.col-700,
.col-780,
.col-860 {
width: 77%;
}

#logo {
float: none;
margin: 0;
text-align: center;
width: 100%;
}
    Thread Starter kamaradski

    (@kamaradski)

    marked as resolved

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘resize widget margin (responsive)’ is closed to new replies.