Make Dl Drop Its Margin through css ocourse

[Lozbo 0]

Theres my page. Theres my headings, my paragraphs and my lists. But then, i want everybody to drop their default margin and padding, so that i can assign them other. Actually there wont be any margin, so the backgrounds of sucesive adjacent elements wont look odd.

The only one giving trouble is the Definition list, i dont know how to tell it not to have that margin, or padding or whatevers messing around.

Here, have my code:

<h3>Escolaridad</h3>
<dl>
 <dt>Carrera</dt>
 <dd>Licenciatura en Sistemas de Información por la Universidad de Guadalajara; CUCEA Agosto 2001 - Junio 2005 <br />
   Titulación por Excelencia<br />
   Mejor promedio de la Generación saliente en el ciclo 2005 A<br />
   Constancia en la XXX Ceremonia de Reconocimiento y Estímulo a Estudiantes Sobresalientes - CREES 2005 </dd>

And its respective css:

div#container h1,div#container h2,div#container h3,div#container h4,div#container h5,  	div#container p,  	div#container ul,  	div#container ol,  	div#container dl,  	div#container li,div#container dt,  	div#container dd,	{margin:0 !important;}

What should i do? its still showing this darn white space between the h3 and the dl...

Thanks in advance!

- 10730

[Tyssen 0]

Have you got padding applied to any of the elements involved? And rather than setting margin:0 the way you have, you'd be better off doing this:

 

* { margin: 0; }

That sets it to 0 for every element. Then you put it back on for the ones you want it to have.

[arboc7 0]

I agree with Tyssen (again...as on many occasions). Also, why are you using "!important" when you could use much better, fully standards-compliant CSS or use simpler CSS browser filters?? That just doesn't make sense to me. Oh well...Good luck!

[Lozbo 0]

Wait, what do you mean full standards-compliant css? isnt "!important" standard? I'll try the * thing, thanks... And what are those css browser filters?

[Tyssen 0]

And what are those css browser filters?

I'm not positive, but I think he may have been talking about CSS hacks to feed certain rules to some browsers and not others, e.g.:

* html #yourDiv {width: 200px;w\idth: 220px;}

That gives one value to IE5+ but then sets it back again for IEMac/IE6. The rule is ignored by all other browsers.
There are other selectors you can use to feed rules to non-IE browsers only too.

[Lozbo 0]

I do know about the hacks, but what i ask about the css filters is how they work or what exactly are them, js + css amalgam or what? Couse i've seen some around, im not sure if they are actually hacks or built in kinda custom scripts which make crazy things, like blury text and other stuff, im not sure which or how but i once got to see one, but i didnt understand css back then, all i know is that dreamweaver actually supports them but i dont know how to use them (they can be found in the last section of the css style panel when you visually edit a rule, i mean, not in the code part). And about the !important thing... some arboc said that why dont i use a fully standards compliant rule (refering to !important) so i ask is it not !important a standard?Thanks!

[Tyssen 0]

And about the !important thing... some arboc said that why dont i use a fully standards compliant rule (refering to !important) so i ask is it not !important a standard?

It it fully supported but most of the time when you see it in newbies' stylesheets is cos they don't properly understand the rules of CSS inheritance or specificity. They can't figure out why a certain rule is not working so they give it !important when really they should be searching for the cause of it not working as required.

[Lozbo 0]

I dont quite understand that yet hehe bythe way... :)I know that the more specific the rule is the higher the importance of inheritance is and i saw a rule to get how much weight exactly a rule has, for the name of the element, the class and the id (the more specific, the more weight) but dont understand it totally...