Wondering if this will always be free?  See why free is better.

Main Menu

Custom Sidebar width change

Started by [chrisB], February 04, 2023, 12:21:28 PM

Previous topic - Next topic


I use this edit on my site:
/* ----------------------- */
/* Custom sidebar testing. */
/* Adjust @media min-width to suit personal preferences. */
/* There will be a range between sidebar & mobile menus. */
/* In this range, menus will be standard 2.1 drop menus. */
/* ----------------------------------------------------- */
@media screen and (min-width: 720px) {
    /* Overflow needed due to clear: both; on children. */
    #admin_content {
        margin: 0 0 0 234px;
        overflow: auto;
    /* Fix minor inconsistencies due to icons. */
    #admin_content .cat_bar:first-child .catbg {
        max-height: 38px;
        min-height: 38px;
    /* Sidebar wrapper. */
    #genericmenu {
        float: left;
    .generic_menu {
        margin: 0;
    /* Top level. */
    #genericmenu .dropmenu > li {
        display: block;
        margin: 0;
    /* Level 2 submenu links, displayed as .cat_bar headers. */
    #genericmenu .dropmenu>.subsections>a {
        padding: 8px 12px 6px 12px;
        background: linear-gradient(#f7f8f9, #e5e9f0) !important;
        color: #4f586a;
        font-size: 1.125rem;
        font-weight: 400;
        text-shadow: 1px 1px 1px #fff;
        border: 1px solid #ddd !important;
        border-bottom-color: #ccc !important;
        border-radius: 6px 6px 0 0 !important;
        box-shadow: none !important;
        pointer-events: none;
    /* Level 2 submenu wrappers, displayed as sidebar blocks. */
    /* Note: flickers on hover, due to Superfish/HoverIntent. */
    #genericmenu .dropmenu>.subsections>ul {
        position: static;
        display: block !important;
        margin: 2px 0 6px;
        background: #f7f8f9 !important;
        border: 1px solid #ddd !important;
        border-radius: 0;
        box-shadow: none !important;
        opacity: 1 !important;
    .subsections {
        position: relative;
How do I change the width of it all completely?
I'm stuck in a time warp from the early 00's.

Diego Andrés

Do you have a link to the topic where you got it from?
Would be better to have a bit of context on this.

Is it the Ant's tip? I couldn't find the topic.

SMF Tricks - Free & Premium Responsive Themes for SMF.


I actually found it searching sidebar or custom sidebar in the forums here, I think it was to mainly tweak the ACP but it also changes the user profiles.

So, instead of having menus/drop down items - it lists them in blocks.

Unfortunately, I can't find it again.

If you check the custom theme you created me, it will be in there. In the default theme it does have a gap between content.
I'm stuck in a time warp from the early 00's.

Sir Osis of Liver

Ashes and diamonds, foe and friend,
 we were all equal in the end.

                                     - R. Waters

Diego Andrés

  @media screen and (min-width: 720px)
#genericmenu {
  padding-right: 10px;

SMF Tricks - Free & Premium Responsive Themes for SMF.