Member Avatar for iamthwee

When using css tags why is there such a gap

For example


Why is there a massive vertical gap between the two <h1>and<h2> tags
... how can you get rid of it?

Member Avatar for iamthwee

For example my css is:

h1 {text-align:left;
    font-family:Arial,"Times New Roman";

h2 {text-align:left;
    font-family:Tahoma,"Times New Roman";

h3 {text-align:left;

But when I use it in my html body tags it makes a paragraph space between each css tag. How do I remove this gap?

margin:0; and or padding:0; nothing in your css overrides default spacing,

the manual, the online docs, at are very good, dont have the full link rattling round the empty space on my neck

Member Avatar for iamthwee

Thanks can you give me an example.

h1 { text-align:left;font-family:Arial,"Times New Roman";font-size:0.8em;font-style:normal;font-weight:bold;
margin-top:0;margin-left:auto;margin-right:auto;margin-bottom:0; } // the new bit
h1:first-letter {font-size:200%;font-style:bold;float:left;}//playtime

centrs the h1 on the page left/right(if smaller than full width) no margins top bottom so the next div butts close, and creates a drop cap because I like drop caps
removing margins from one element may leave a margin, if the next element has a margin, <div><p> etc

Member Avatar for iamthwee

A ha... Do you have to add that new line to EACH <h#> tag?


commented: Props +15
Member Avatar for iamthwee


if you want to ensure margins you can

* { margin:0;} // all elements
// or
h* {margin:0;margin-left:auto;margin-right:auto;} //all h elements

in the top of the css file, preset all the element margins to 0
then everything will butt up unless and untill you give the element some spacing deliberately

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.