Unwanted css is injected into posts
Some of our users insert css into their posts without their knowledge. This css appears to be ad related and is not generated by the word processor and only consists of css and html. Below is an example:
.adslot-overlay
{
position:absolute;
font-family:arial, sans-serif;
background-color:rgba(0,0,0,0.65);
border:2px solid rgba(0,0,0,0.65);
color:#FFF!important;
z-index:2147483647;
text-decoration:none;
box-sizing:border-box;
text-align:left;
margin:0;
}
.adslot-overlay-iframed
{
top:0;
left:0;
right:0;
bottom:0;
}
.slotname
{
position:absolute;
top:0;
left:0;
right:0;
font-size:13px;
font-weight:700;
vertical-align:middle;
background-color:rgba(0,0,0,0.45);
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden;
padding:3px 0 3px 6px;
}
.slotname span
{
text-align:left;
text-decoration:none;
text-transform:capitalize;
}
.revenue
{
position:absolute;
bottom:0;
left:0;
right:0;
font-size:11px;
vertial-align:middle;
text-align:left;
background-color:rgba(0,0,0,0.45);
font-weight:700;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
padding:3px 0 3px 6px;
}
.revenue .name
{
color:#ccc;
}
.revenue .horizontal .metric
{
display:inline-block;
padding-right:1.5em;
}
.revenue .horizontal .name
{
padding-right:.5em;
}
.revenue .vertical .metric
{
display:block;
line-height:1.5em;
margin-bottom:.5em;
}
.revenue .vertical .name,.revenue .vertical .value
{
display:block;
}
.revenue .square .metric,.revenue .button .metric
{
display:table-row;
}
.revenue .square .metric
{
line-height:1.5em;
}
.revenue .square .name,.revenue .square .value,.revenue .button .value
{
display:table-cell;
}
.revenue .square .name
{
padding-right:1.5em;
}
.revenue .button .name
{
display:block;
margin-right:.5em;
width:1em;
overflow:hidden;
text-overflow:clip;
}
.revenue .button .name:first-letter
{
margin-right:1.5em;
}
a.adslot-overlay:hover
{
border:2px solid rgba(58,106,173,0.9);
}
a.adslot-overlay:hover .slotname
{
border-bottom:1px solid rgba(81,132,210,0.9);
background-color:rgba(58,106,173,0.9);
}
a.adslot-overlay:hover .revenue
{
border-top:1px solid rgba(81,132,210,0.9);
background-color:rgba(58,106,173,0.9);
}
div.adslot-overlay:hover
{
cursor:not-allowed;
border:2px solid rgba(64,64,64,0.9);
}
div.adslot-overlay:hover .slotname
{
border-bottom:1px solid rgba(128,128,128,0.9);
background-color:rgba(64,64,64,0.9);
}
div.adslot-overlay:hover .revenue
{
border-top:1px solid rgba(128,128,128,0.9);
background-color:rgba(64,64,64,0.9);
}
I have done a search on the internet and cannot see any explanation. All I get is several other sites with similar css like:
http://www.greenbiz.com/video/2012/02/24/john-donahoe-conversation-joel-makower
http://bloggers.com/posts/tamilactressbook-47592 (every post)
It would seem that this css is injected via javascript since there are so many js declaration scripts and that publishing engines use a wysiwyg editor like tinymce. It might be browser related and it might be add-on dependent. It's a mystery at this point and I'm wondering if anyone else has met it.
source to share
You need to figure out if it can be isolated when the CSS was introduced and where it can all be found in your database. There are several scenarios. First, blogging software like this might have an exploit that could allow it to be injected. If it's SQL injection directly against the website, this CSS code could be all over the place. Several years ago I worked for a company that had an exploit on one of its sites and I have to admit that the sql code for input was very smart. Basically, if you had strings with any text field (varchar / text), a javascript snippet (or part of it) would be inserted into all of those fields.
If it is only introduced when a user posts messages, well, for everyone we know, it could be due to the harmless result of several factors.
Interestingly, on the first page I see that this description meta
also contains css:
<meta name="description" content="eBay CEO John Donahoe explores the business case for sustainable consumption, addressing the unique opportunities and roles of big business, small business, and technology in driving this shift.
.adslot-overlay {position: absolute; ...">
edited for brevity.
So I think we are looking at some kind of automatic SQL injection.
Now why css? Well, I also think this should be used in conjunction with another attack (unless it is part of the same attack that I have not identified yet). From the css we can see that the odslot-overlay is positioned absolutely, and that the z-index z-index: 2147483647;
, which I think is as high as it can be set. If this code actually turns it into a style tag, or linked to a css file, it can be used in conjunction with content, which actually has classes used to overlay the page, making it look like a Generic Viagra ad webpage or something yet
Now, I must admit that I have made several assumptions here, and probably some of them are not true. Most likely it is that:
- your software for your blog is available,
- Your database will need a lot of cleanup after you close the holes (sorry).
source to share
I started experiencing this yesterday. It inserts into every post as soon as I click publish. Looking for answers to a question on how to fix this and came across your post. Thanks to
Update: I've spilled all my files for hours and couldn't find anything fishy. The only thing I could think of about what I had done before was approving some of the comments that were "sketchy".
Unfortunately, I didn't take a scientific approach to fix the problem. I closed the browser window I was using, opened my blog in another window, and moved those approved comments to the trash bin.
I ran a test message and the "garbage" no longer appears in my messages. Just wanted to update for anyone looking for this issue.
source to share
I believe I figured it out. This is caused by the Google Publishers Panel , Chrome Extension.
This is a bug, not an attack.
With GPT enabled, almost every time I load the jsFiddle, this CSS is inserted. When I turned it off, I had no problem again.
source to share