Forums: Index > The Cathedral > Modifying Oasis layout

As you guys have known for very long time that the wikia's Oasis skin is so unpopular due to its width definition, hence constantly sandwiching the main content. Some uses the old MonoBook skin which causes conflicting edits with Oasis skin users. We have the tool to override the Oasis layout by adding new definitions to Mediawiki:wikia.css as long as we don't do something entirely against wikia's customization policy so it looks closer to MonoBook skin. Here is my experiment with my testing wikia project:

.WikiaPage {
   width: auto;
   max-width: none;
   margin: 0;

/* Originally margin-right:310px. The culprit which squeezes the content zone */
.WikiaMainContentContainer {
   margin-right: 18em;
   min-width: 800px;

.diff-article-content {
   width: 100%;

/* Oasis' right sidebar. Originally width:300px. 17em is closer to the Monobook sidebar width, albeit not too precise. */
.WikiaRail {
   width: 17em;

/* With WikiaRail's width tightened, the properties of the following WikiaRail contents need to be adjusted as well. */
/* Search bar text entry width */
.WikiaSearch input[type="text"] {
   width: 184px;

/* Recent photos */
.carousel-container {
   transform: scale(0.6);
   position: relative;
   top: -80px;
   left: -42px;

The only change I fail to make is the WikiaRail recent videos, but I doubt any user cares. It looks not so pretty after the width change of WikiaRail, but I can't even hide it with display:none. -- Inpursuit (talk) 03:56, May 7, 2014 (UTC)

I see. Definitely looks more spacious when I'm looking at it. I see what you mean about the video editor but stat templates also seemed to be aligned to the center of the page. Great Mara (talk) 13:57, May 7, 2014 (UTC)
Stat templates are already so in MonoBook skin, although it's no big deal to align them leftward and define margin-left:20px or so. -- Inpursuit (talk) 03:25, May 8, 2014 (UTC)
Thank Bluerfn for updating the CSS, but I missed one minor thing that the diff comparing page still uses the original margin-right definition. Simply add ", .diff-article-content" after ".WikiaMainContentContainer" should do. -- Inpursuit (talk) 04:14, May 14, 2014 (UTC)
Fixed. The sidebar on the right does seems a bit scrounged but still tolerable to me. BLUER一番 17:04, May 14, 2014 (UTC)
The sidebar does bother me a little, but I guess that's just something we can get used to.
EDIT: Though, the "photos" section is not doing well. -MinatoHikari (talk) 18:25, May 14, 2014 (UTC)
It doesn't work because it is overridden by .WikiaArticle .diff-article-content {margin-right: 340px;}, but adding !important after margin-right: 18em can bypass it. -- Inpursuit (talk) 23:19, May 14, 2014 (UTC)
Doesn't work again. I think the width of the .diff-article-content should be defined separately because it is wrapped inside .WikiaMainContentContainer, the current de facto margin-right of diff-article-content becomes 18em*2=36em. I'm not 100% sure because there is some limitation on Firefox's code inspector and its temporary CSS modifier. -- Inpursuit (talk) 03:10, May 15, 2014 (UTC)