css resetar herança, ou ignorar

[lucas_pinheiro 0]

Olá amigos, gostaria de saber se possível, e como resetar o css de uma div especifica.

 

exemplo, fiz um editor de texto.

o texto tem tags html

 

na pagina de visualização carrega todo o site, e uma div que vai mostrar o conteudo do editor, como mostrar o conteudo sem que a div herde o css do meu site.

 

grato.

[No Rain 0]

Você deve declarar o estilo na própria tag. A página será carregada com o estilo declarado na tag ao invés do estilo do arquivo.css

 

exemplo

 

<style type="text/css">
div {
   height:300px;
   width:800px;
   background: #0CC;
   margin:0 auto;
}
</style>

 

 

<div style="height:100%; width:500px; background:none; }

[Evandro Oliveira 331]

Se a DIV é específica, o primeiro passo é IDentificá-la.

 

Depois disso, defina as propriedades como deverão ficar. Alguns valores padrão para DIV são:

 

background: transparent;
border: none;
color: inherit;
display: block;
font: normal normal 14pt/1em inherit;
height: auto;
line-height: 1em;
margin: 0;
overflow: visible;
padding: 0;
vertical-align: baseline;
width: 100%;

 

Para evitar que uma propriedade seja sobrescrita, adicione a marcação !important depois do valor, antes do ponto-e-vírgula.

Para evitar que TODAS as propriedades sejam sobrescritas, adicione os valores como última modificação das CSS

[Flach 0]

Acho que ninguém entendeu a dúvida do Lucas.

 

O que ele precisa na verdade é que um DIV perca toda as heranças que tiver para que dentro desse div ele possa inserir um conteúdo HTML que um usuário criou em um editor de HTML e que por conta das heranças da página acaba não ficando 100% igual ao que era exibido no editor.

 

Também queria muito saber se isso é possível porém pesquisei bastante na internet e nunca encontrei uma forma que realmente funcione.

 

Se alguém souber ajudaria bastante.

 

Valeu!

[L. Henrique 179]

Não tem como um elemento filho não herdar a classe de um elemento pai. Pra você remover o estilo ou alterar, é necessário adicionar uma nova classe a esse elemento filho.
Ex.:
HTML

<div class="pai">
   <div class="filho"></div>
</div>

CSS

.pai {
   width: 100%;
   height: 100%;
   background: red;
   font-size: 2em;
   color: #FFF;
}
.pai .filho {
   width: 0%;
   height: 0%;
   background: #FFF;
   font-size: 1em;
   color: #000;
}

Lembrando que, um elemento filho também não altera as condições de um elemento pai, ou seja, caso o elemento filho receba um background: none; o elemento pai continua com o background: red; sendo visível.

O que dá pra fazer é o famoso "Override" (sobrepor). É o método de sobrepor a classe do pai oferecendo atributos ao elemento filho.

Q: Ah! Mas não da pra fazer por JS/JQ?
R: Negativo. Se o JS remover a classe de herança do elemento filho, a do elemento pai continua sendo visível, resultando em nada.