PDA

View Full Version : HTML Default CSS instead of Ext CSS



rdx_guy
20 Jul 2009, 7:17 AM
Hi All

I have tried to google this thing but seems none has this issue before. I have a normal HTML page in which I am using HTML tags which uses default css..

I had a requirement to show a Ext Js pop up for which I had included ext-all.css and I am using Ext.Window object for that purpose but this css is also affecting my normal HTML elements.


"html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td{margin:0;padding:0;}

img,body,html{border:0;}

address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}

ol,ul{list-style:none;}

caption,th{text-align:left;}

h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}"

This is the ext css portion which overrides default HTML tags. Please guide me how can I save my dafault HTML tags and show default CSS..

Let me know if you need any more information from me.

Thanks,
Pankaj

tryanDLS
20 Jul 2009, 7:23 AM
This has been covered many times - search for reset.css

rdx_guy
21 Jul 2009, 4:38 AM
You are right my friend but still I have some questions. First we need to override your default reset.css and due to that my ext js code in the page gets screwed...

So I need to look into each and every HTML tags which have been used in that particular page and need to fix it manually..

There should be some handy solution.. I could be wrong but please let me know is this the only approach or we have some other options also??

Thanks,
Pankaj

tryanDLS
21 Jul 2009, 6:13 AM
You only need to override the tags if you have code some generic css - e.g


p {font-color:red; font-size: 16px}


You shouldn't be coding css to that generic level any way. If you are trying to fit Ext into a legacy page, this may require more work, than if you were displaying legacy html in say an Ext.Panel, which you could override to allow the reset.css to not apply within it (preventBodyReset config)