XF 2.x widget grid position

maszd

cXF BRONZE
cXF Donor
Messages
112
Likes
43
#1
Hi @BassMan

how to make widget position on forum list like this one:

2018-04-08_055916.png

iam try to make a html widget and insert few widget inside this html like this one:
2018-04-08_060424.png

but its show like this one:
2018-04-08_060529.png

you can see this site for example : TechPowerUp Forums

thanks.
 

BassMan

Staff member
Administrator
Messages
688
Likes
329
Website
www.customizexf.com
#2
You can try it like this:

HTML widget template:
HTML:
<div class="grid-main">
    <div class="grid">
        <xf:widget key="forum_overview_new_posts" />
    </div>
    <div class="grid">
        <xf:widget key="forum_overview_forum_statistics" />
    </div>
</div>
Add to extra.less:
CSS:
.grid-main {
    display: flex;
}
.grid {
    display: flex;
    flex-direction: column;
    min-width: 250px;
    flex: 1 1 250px;
}
.grid:first-of-type {
    margin-right: 2%;
}
.grid .block, .grid .block-container {
    height: 100%;
}
@media (max-width: @xf-responsiveMedium)
{
    .grid-main {
        display: inherit;
    }
    .grid:first-of-type {
        margin-right: inherit;
    }
}
 

You must log in or register to reply here.

Forgot your password?
Don't have an account? Register now

Welcome to customizeXF

We are running default XenForo style customized by cXF
Registration is free!

Similar threads

Top