|
Posted by Shaun on February 22, 2005, 12:17 pm
Please log in for more thread options
Hello!
I have a quick question regarding CSS and having it applied to all
elements. I am trying to eliminate the gap between a paragraph and a
list that usually occurs in html and I've found away to do that with
this code:
<p>a</p>
<ul style="margin-top: -20; padding-top: 0">
<li>1</li>
</ul>
However I was hoping to use CSS to do it to all elements and without
using <DIV id="">. Here is an example of the CSS code I have so far,
but you need to use <div id="squish"> around them.
<style type="text/css">
#squish {
width: 10em;
}
#squish ul {
margin-left: 1em;
margin-top: -20;
padding-top: 0;
padding-left: 0;
}
</style>
Is there a way to apply this to all bullets <UL> <LI> on the page
using CSS without having to use <div id="">?
Thanks for your help!
Shaun
|
|
Posted by Lauri Raittila on February 22, 2005, 9:20 pm
Please log in for more thread options
in comp.infosystems.www.authoring.html, Shaun wrote:
> Hello!
>
> I have a quick question regarding CSS and having it applied to all
> elements.
Then why are you asking here? alt.html where you asked first is good also
for CSS, but this group is only for HTML. There is
comp.infosystems.www.authoring.stylesheets for CSS.
> I am trying to eliminate the gap between a paragraph and a
> list that usually occurs in html and I've found away to do that with
> this code:
>
> <p>a</p>
> <ul style="margin-top: -20; padding-top: 0">
> <li>1</li>
> </ul>
Which is wrong, as pointed out for you in alt.html
> However I was hoping to use CSS to do it to all elements and without
> using <DIV id="">.
Then why are you using div with id?
> Here is an example of the CSS code I have so far,
> but you need to use <div id="squish"> around them.
[snip]
Go look for selectors in CSS
> Is there a way to apply this to all bullets <UL> <LI> on the page
> using CSS without having to use <div id="">?
Most likely, but I fail to understand your question.
ul
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts> Utrecht, NL.
|
|
Posted by Gus Richter on February 22, 2005, 11:50 pm
Please log in for more thread options
Shaun wrote:
> Hello!
>
> I am trying to eliminate the gap between a paragraph and a
> list .....
I guess that you have to understand that P and LISTS are blocks and that
blocks provide double 'line leading/breaks/line returns' as a
conventional default. This is done by the browser with a default
margin-bottom and margin-top. (The double line leadings for both are
collapsed to only one double line leading.)
In order to eliminate the double line leading, the margin-bottom for the
preceding Paragraph must be set to zero and the margin-top for the
subsequent List must be set to zero.
--
Gus
|
| Similar Threads | Posted | | IE Bullets and Tables Collide | June 9, 2005, 6:26 am |
| CSS gap between inline elements | February 7, 2008, 3:03 am |
| Form and nested elements | November 10, 2004, 11:57 am |
| Visibility of form elements | December 3, 2004, 8:01 pm |
| Presentational and Structural Elements | September 22, 2005, 10:56 am |
| form elements which should not be submitted | March 9, 2006, 3:17 pm |
| custom tags and elements | December 5, 2006, 4:57 am |
| Don't print certain elements from a page | February 17, 2007, 3:38 pm |
| Extending HTML Elements | April 19, 2007, 8:46 am |
| How to push elements to the bottom | August 21, 2007, 6:07 am |
|