CSS code is being stripped out by HTML editor... Help?

We are working within an online shell that will allow a certain amount of changes. On all pages there is an editor that I can use to insert text, graphics, links and using the HTML button, code. I wanted to clean up the scrolling text look so put together a fairly simple page in CODA that include about 40 lines of CSS and about the same of HTML… Along with some links to some graphics. Everything is working fine when i test the code on its own in 3 different browsers…

The problem comes when I copy the code into the HTML editor of our shell program… Which does not allow .css files. N matter how I have tried to input it (and I wanted to stay away from inline styling) the CSS gets stripped out when I update the page. Apparently everything outside of the <body> tags gets stripped out… I was advised to put the CSS inside the <body> but that resulted in stripped CSS too… tried sneaking it inside the first <div> tag and hoped I could hide it there… To no avail… Stripped out again…

Must be something easy I’m missing here?

Sounds quite specific to the editor, which you do not name.

I can’t think of any known generic similar issue with HTML editors in general.

Since inline styles cannot work for pseudo states (focus, hover, active) or pseudo-elements (before, after), I would see if there was a way to avoid using the editor entirely.

Hi stomme… Not sure which editor it is… The site actually looks like a joomla built template… Could be tinyMCE… It’s a fairly extensive editor but I have no way of turning it off as I have no access to the joomla admin itself… I know in joomla certain editors create problems with copy and paste text/code and turning off all but the basic one seems to work… But again… I can’t do that here… when I contacted the program/template developer they told me why the CSS was originally being stripped out and their suggestion was to put the CSS within the HTML or inline… 2nd is not very feasible and not sure how to do the first other than How I outlined above

Just to be clear, did you try to put the css above the <body> tag something like this:


<!DOCTYPE yourdoctype>
<html>
<head>
    <meta your meta stuff>
    <link lotsa joomla links>
    <title> your title </title>
    <style type="text/css">
your local css styles go here.    /* this is where the local css should go */
    </style>
</head>
<body>
    page html and content goes here
</body>
</html>

If the editor does not allow this, then the shell programmer needs to revisit his shell.

Hi ronpat
That was the original way I inserted the code… Then without the HTML declarations… Then without the <head> tags… Then without the <body> tags… And just beginning with the first <div> tag… Taking out the <style> tag leaves the CSS code in, but only as text… All others except the last one stripped the CSS out… That’s why I figured I must have done something wrong with where I tried to put the CSS code… It would all be simpler if I could upload the .css file and refer to it… But that’s not allowed in this shell…

I should probably add that the code I am trying to insert is for a single middle section of the page, not the entire page. The is already a header, 2 side sections and a top menu… The middle section is editable in that i can change the content, size, fonts etc… And supposedly change the HTML… But that’s where I run into problems with the CSS stripping out… The site I am working with is http://wncc.ca… It’s the centre section i am trying to change

It still sounds like a process problem. You are being tasked to do something that you cannot complete without the involvement of the person who is responsible for the css, or some such process to handle exceptions to the controls being enforced by the shell. Otherwise, you are limited to using only the existing css. That’s how it seems.

I took a slightly closer look at that home page. ALL of the code in the middle section uses inline styles. The NESTS of <span> tags read like a very bad comic book. However, that is the way the owner of that page intends for it to be maintained. That’s the way the “process” is designed. Best of luck.

Thanks ronpat…

But it sounds like a a big ouch!..

Guess our only recourse right now is to either get them to either rework their site to allow us more access or to get them to let us upload and maintain our own wnccstyles.css file and ensure its loaded up at the startup of the home page?

Agreed. Hopefully, you can address the process issue and work something out.

As it has been said before, it maybe the process and your HTML editor is intended to strip embedded CSS.
For what I can tell, your shell programs uses “component” files (similar to DW templates) for the head of of your documents, so you would really be needing to edit these components. Perhaps you can even save your CSS as an external file and add the link to the template?

An ALTERNATE strategy is to find the blkmaroon3.css file that the template already is bringing in and EDIT/APPEND your lines of CSS to it.

Your inline CSS will override everything, of course, but I hazard to guess that’s that is actually put there by the CMS’s text editor itself.

Thanks d_p

Pretty sure the blkmaroons3.css file is a file they use as one of the colour options that more than just our club might use so they probably won’t want us appending that one, else that would be a good idea. I think the best bet is to get some admin priv’s that will allow me to upload the .css file via FTP (not presently allowed) and then just have them include the link to that .css file in the <head> of their startup page… That way I should be able to make any changed needed throughout the site to the one .css file only and not go through this hassle all the time.

Will let you all know how it works out… And once again, thanks folks for helping clear this up.