ISSUE SUMMARY:

i need to change the width of sidebar-2 socialize template to 18% and content will be 82% perspective. what is the css to me inserted on custom css?

i did try to follow in this forum, www.jomsocial.com/forum/socialize-templa...-of-sidebar-2#129237 reply by albertus, yes its working on desktop. BUT when on mobile phone its still show sidebar-2 on the right.
STEPS TO REPLICATE:
1
2
3
4
5
RESULT
EXPECTED RESULT
BROWSER

Hi,

I already provided you the solution on your another topic simliar like this issue, have you tried that?

thx

yes.... i already try.... i can't see the topic anymore.

and i try the solution from the link here www.jomsocial.com/forum/socialize-templa...-of-sidebar-2#129237 . its working, but it affect mobile veiwing

you should add mobile and desktop condition like this :

/* deskltop */
.classname{
 paramater : value;
}

/* mobile */
@media (max-width:320){
.classname{
 paramater : value;
}
}

so do you mean, i have to put this cod into my custom.css

/* deskltop */
.classname{
paramater : value;
}

/* mobile */
@media (max-width:320){
.classname{
paramater : value;
}
}

including this:

.t3-content.col-md-9 {
width: 50%;
}

.t3-sidebar-right.col-md-3 {
width: 50%;
}

code provided by Albertus

sorry for the trouble, i also leaning from the forum all the time. :)

yes, in mobile device you should set the width to 100% for full width, so you wont get double colomn on mobile device

/* deskltop */
.classname{
paramater : value;
}

/* mobile */
@media (max-width:320){
.classname{
paramater : value;
}
}
.t3-content.col-md-9 {
width: 82%;
}

.t3-sidebar-right.col-md-3 {
width: 18%;
}

Is this correct?

like this

/* deskltop */
.t3-content.col-md-9 {
width: 82%;
}

.t3-sidebar-right.col-md-3 {
width: 18%;
}

/* mobile */
@media (max-width:320){
    .t3-content.col-md-9 {
       width: 100%;
    }

    .t3-sidebar-right.col-md-3 { 
        width: 100%;
    }
}

After adding this code to my custom.css

/* deskltop */
.t3-content.col-md-9 {
width: 82%;
}

.t3-sidebar-right.col-md-3 {
width: 18%;
}

/* mobile */
@media (max-width:320){
.t3-content.col-md-9 {
width: 100%;
}

.t3-sidebar-right.col-md-3 {
width: 100%;
}
}

the end result see attac

try this :

/* deskltop */
.t3-content.col-md-9 {
width: 82%;
}
 
.t3-sidebar-right.col-md-3 {
width: 18%;
}
 
/* mobile */
@media screen and (max-width:700px){
    .t3-content.col-md-9 {
       width: 100%  !important;
    }
 
    .t3-sidebar-right.col-md-3 { 
        width: 100% !important;
    }
}

Now.... thats great...... its working :)

nice, you should be graduated now :)

Hello dimas, thanks for the support you gave me.

I just want to add cart on my community toolbar. i did post it before, but i can access it anymore due to my jomsocial license expired.

please consider im asking for support on adding cart to community toolbar , since its under socialize template. :)

please you add the component for cart, and enable the plugin / module the cart icon.. i will help you with the simple css