Unanswered: Load external URL, remove CSS, apply new CSS
Unanswered: Load external URL, remove CSS, apply new CSS
I'm trying to load posts from a blog into a panel, but the original styles are a mess. So I'd like to apply my own css. Is it possible?
My code:
showPost: function(list, index, element, record) {
this.getBlog().push({
xtype:'panel',
title: record.get('title'),
html: record.get('content'),
scrollable: true,
config:{
// styleHtmlContent: true,
cls: 'blogExt'
}
});
},
styleHtmlContent set to true doesn't work, as it loads the blog styles,
styleHtmlContent set to false doesn't work either, as it removes the original style but doesn't allow further styling.
Is there any work around? Thanks in advance.
Fernando
Thank you, Mitchael. The fact is that I also tried it without config and it didn't work either. That was my last change and it was certainly a wrong try. If the problem is not in that, where is it?
showPost: function(list, index, element, record) { this.getBlog().push({ xtype:'panel', title: record.get('title'), html: record.get('content'), scrollable: true, styleHtmlContent: true, // true: applies web css styles - false: does not apply any style. cls: 'blogExt' // it's of no use }); }
Inspect the DOM. If the styles are inline then not much you can do. If the html comes with CSS then there is some you can do but the blogExt can now be used.
You're right. There're too many elements with embedded styles (mainly a <iframe>) so that it's impossible to change the width attribute. It affects all the rest. Better to live in light of truth than pursue a phantom target. Thank you for your tips.
Fernando