[How To?] Allow CSS IN Posts

[Nicole-Studios]

I'm curious if anyone would know how I would get CSS to work in posts? I've seen several MyBB forums that allow CSS to work in posts but can't seem to find a plugin to allow this so this must be some other type of modification?

Any ideas anyone?


What I mean by css in posts is to allow this in posts and to have it WORK:

<style>
css in here
</style>

[nth]

You could create a MyCode but I would not personally recommend it.

[laie_techie]

CSS is as dangerous as HTML.

[Nicole-Studios]

^ I'm not exactly sure what you mean but I have a very mature community of people on my RPG as well as it is small. I would like to use CSS because it's nice to have for hover tables and fancy things for posting tables. I'm not asking for opinions, just asking for ideas on how to make this work.

And what do you mean nth? A MyCode?

[.m.]

MyCode using inline styling should be possible !

Regular Expression => \[style=(.*?)\](.*?)\[/style\]
Replacement => <div style=$1>$2</div>

eg.

[style="color:red; background:blue;"]testing[/style]

[style="text-align:center; color:green;"]okay[/style]

[style="text-align:right; border:1px solid blue;"]right[/style]

[laie_techie]

^ I'm not exactly sure what you mean but I have a very mature community of people on my RPG as well as it is small. I would like to use CSS because it's nice to have for hover tables and fancy things for posting tables. I'm not asking for opinions, just asking for ideas on how to make this work.

And what do you mean nth? A MyCode?

CSS can make it so you don't see content, either by controlling the size or by matching foreground and background colors. CSS can cause the characters to appear in reverse order or upside down to bypass word filters.

[Nicole-Studios]

/late reply/

Thank you .m. for the reply, however that's not exactly what I meant.

As with html enabled there is no need to do [style=blahblahblah]text[/style]
I can simply just do <div style=""></div>

What I'm trying to do is allow the style tags for css to be placed inside the code itself such as:

<link href='https://fonts.googleapis.com/css?family=Junge' rel='stylesheet' type='text/css'><center><div id="baltable"><div class="balname" style="font-size: 25.5pt;">B<br />A<br />l<br />t<br />u<br />s</div><div class="baltext" style="top: -255px;">
TEXT HERE
</div></div><div style="width: 550px; text-align: right; font-family: times; font-size: 6pt !important; "><a href="https://www.flickr.com/photos/fr4dd/9142749652/in/photolist-eVUYWG-beubc8-4aDHqx-dvMxZZ-2Mv2Vg-7mCS46-7UqcfB-pqS61h-47L1gi-m3WWNk-54mJN4-pSx5B4-gSpVWq-d5spH5-ffYD7q-e7Dve5-a87dP8-f1Pb3e-4FVQFC-pgTKSn-jH4z5Y-dQiDGV-4TsBTm-iLQwxF-4Kid3L-sfwPD4-wBtdwJ-pS2c9-asAxUB-yPEh5m-5UehJU-dWZduX-faLZx6-pX2zEu-gm8w2p-p9m1TP-ponTPg-gv9Xpk-nmXbDy-apx2NF-4aSCfF-q8w9wh-sm1zMB-ns8wVk-cjDb9f-7s8qQ6-guWUdq-aVpcUa-gTGQeo-hZe16F" target="_blank">image</a> | <a href="http://nicole-studios.deviantart.com/" target="_blank">coding</a></div></center>


<style>
/* 
   HI MY NAME IS NIKI, I CODED THIS WITH MY BARE HANDS. DON'T TOUCH, STEAL, COPY MY CODING OR USE IN ANY FORM.
   I DID THIS HARD WORK ALL BY MYSELF, DO YOUR OWN ALL BY YOURSELF.
   Nicole-Studios.deviantArt.com © 2015

   THIS PARTICULAR CODING IS ONLY TO BE USED BY SIREN @ Look to the Stars (ltts.wolvenlore.com)
*/
#drakbox {
background-image: url('http://i.imgur.com/ZqSTXBO.png');
width: 550px;
height: 413px;
border: 5px solid #3d3d3d;
}
.drakname {
color: #ffffff;
font-family: Megrim;
font-size: 35pt;
text-shadow: 1px 1px black;
}
.draktext {
background-color: rgba(61,61,61,0.9);
color: rgba(255,255,255,0.6);
width: 500px;
height: 331px;
overflow: auto;
padding: 6px;
font-family: times;
font-size: 9pt;
text-align: justify;
opacity: 0;
-webkit-transition: 2s;
transition: 2s;
}
.draktext:hover {
opacity: 1;
}
</style>

THE STYLE, part within the code is what I'm talking about allowing.

---

NEVERMIND!

I figured out how to make this work.