Home › Forums › Jevelin Theme › Sidebar width issue after Slider Revolution centering fix
Home › Forums › Jevelin Theme › Sidebar width issue after Slider Revolution centering fix
<p data-start=”219″ data-end=”254″>Hi Shufflehound team,</p>
<p data-start=”256″ data-end=”478″>I recently had support help me with <strong data-start=”292″ data-end=”313″>Slider Revolution not centering properly with the sidebar enabled on my site (http://www.apotheman.com). The centering issue has now been resolved — thank you!</p>
<p data-start=”480″ data-end=”648″>However, I’ve noticed a new problem: the <strong data-start=”521″ data-end=”560″>sidebar has become noticeably wider than before, which makes the layout feel unbalanced (content area is now too narrow).</p>
<p data-start=”650″ data-end=”808″>It’s possible this might be related to some <strong data-start=”694″ data-end=”708″>custom CSS I’ve added. Could you please review this as well to see if it’s clashing with the sidebar styles?</p>
<p data-start=”810″ data-end=”860″>Here’s the custom CSS I currently have in place:</p>
/* ========================================================
✅ 1. LOGO VISIBILITY
– Hide duplicate logos except when mobile menu is open
======================================================== */
.sh-sticky-header img[src$=”APOTHEMAN-LOGO.svg”],
.sh-header-wrapper:not(.sh-mobile-menu-open) img[src$=”APOTHEMAN-LOGO.svg”]:not(.sh-header-left-side img[src$=”APOTHEMAN-LOGO.svg”]) {
display: none !important;
}
/* ========================================================
✅ 2. LOGO SIZING (ALL MENUS / HEADERS)
– Force consistent size for all placements
======================================================== */
img[src$=”APOTHEMAN-LOGO.svg”],
.sh-header-mobile img[src$=”APOTHEMAN-LOGO.svg”],
.sh-mobile-header-logo img[src$=”APOTHEMAN-LOGO.svg”] {
max-width: 140px !important;
width: 90% !important;
height: auto !important;
max-height: 100px !important;
margin: 0 auto !important;
}
/* ========================================================
✅ 3. LOGO IN MOBILE MENU PANEL ONLY
– Smaller size inside the mobile drawer
======================================================== */
.sh-header-mobile-logo img[src$=”APOTHEMAN-LOGO.svg”] {
width: 80px !important;
max-height: 50px !important;
height: auto !important;
margin: 10px auto !important;
display: block;
}
/* ========================================================
✅ 4. SIDEBAR WIDTH
– Control the width of the left sidebar
======================================================== */
.sh-header-left-side {
width: 220px !important;
}
/* ========================================================
✅ 5. REMOVE THEME DEVELOPER COPYRIGHTS
======================================================== */
.developer-copyrights {
display: none !important;
}
/* ========================================================
✅ 6. SLIDER POSITION FIX
– Desktop: shift to account for sidebar
======================================================== */
@media (min-width: 1025px) {
.slider-center-fix {
margin-left: 220px;
}
}
/* ========================================================
– Mobile & Tablet: reset margin
======================================================== */
@media (max-width: 1024px) {
.slider-center-fix {
margin-left: 0 !important;
}
}
/* ========================================================
✅ 7. SECONDARY IMAGE CONTAINER
– Remove transform/transition effects
======================================================== */
.secondary-image-container img {
transform: none !important;
transition: none !important;
}
body.menu-fix-initializing .sidebar-menu {
visibility: hidden;
}
this has been fixed
Hello,
Thank you for letting us know!
Best regards,
Shufflehound team
If you need services beyond standard support, we've got your back!
If you'd prefer not to handle the installation yourself or need help getting started, we'll set everything up for you.
We'll help you rearrange sections, adjust spacing, and modify the page structure to fit your needs.
More complex styling changes, theme option modifications, and third-party integrations.
If you need something that's not included in the theme, we can code it for you.
Web design services to create custom sections, pages, and blocks for your theme, plus graphics and visualizations.
Full website builds, custom theme development, or plugin creation from scratch.
We'll provide a clear quote based on what you need. No hidden fees.