Questions for Facebook look alike style

LogixX · Jul 17th 2016

I'm trying to create a style that would look like Facebook when it's finished. I want to know if it is possible to switch the location of the userPanelItems with the location of the searchBar, and how would I do it? I also need to remove some space above #main > div > div > .content so it is even with the sidebar but I can't figure out how to do it. I have set .boxHeadline and .breadcrumbs to display: none; but still can't get rid of the extra space. You can see the style I'm working on here http://wbbadmin.com/index.php?board-list/ and you can see what I'm trying to accomplish below.

I want the style to look like this when I'm done. The image has been Photoshopped.

Fabi_995 · Jul 17th 2016

CSS

.userPanel > div > .searchBar {
	position: relative;
	float: left;
}
.userPanelItems {
	float: right;
}

Works fine for me

LogixX · Jul 17th 2016

Thank you @Fabi_995. I tried that with Inspect Element and couldn't get it to work correctly, it does when you add it to the Individual CSS field in Advanced Settings.

Does anyone know how to get rid of the extra space above #main > div > div > .content?

Morik · Jul 17th 2016

the problem is, that your board-list has a margin top attribute to have spaces between the categories.
You could try this:

Code

.wbbBoardList .wbbDepth1 {
    margin-top: 0px;
    margin-bottom: 14px;
}

but its just a workarround and may have unwanted sideeffecs, for example with user notices etc

LogixX · Jul 17th 2016

Thank you @Morik. That worked and I don't notice any side effects.

LogixX · Jul 17th 2016

Can someone please tell me how to removed the extra space that is appearing to the right of the posts? If I removed the padding from #main > div > div > .content it removes the extra space but it smashes the wbbBoardList against the forum's sidebar.

Fabi_995 · Jul 17th 2016

CSS

#main > div > div > .content {
    padding-right: 0px;
}

LogixX · Jul 17th 2016

Quote from Fabi_995

CSS

#main > div > div > .content {
    padding-right: 0px;
}

When I do the above, I lose the padding between the wbbBoardList and the forum sidebar, like below.

Morik · Jul 17th 2016

Code

#main > div > div > .content {
        padding-right: 0px;
    }
    #main.sidebarOrientationRight > div > div > .content {
        padding-right: 21px;
    }

LogixX · Jul 17th 2016

Thank you again @Morik, that works perfectly!

Questions for Facebook look alike style

Participate now!

Share