CODEWITHSUNDEEP
css
5 Star Cruises
5 Star Cruises

Reputation: 1

LIne Break before and after h1 tags

Hi i am new to CSS and i might be asking some school boy questions. I want to but a line break at the top of my post before and after my h1 tags. I might be trying to do this by the wrong method. Maybe i need some padding at the top but defiantly need a line break after each H1.

This is my css for posts

#kopa-post-content p,h1,h2,h3,h4 {text-align:left;margin-right:20px;margin-left:20px}

Example of what i am trying to do.

Any help will be gratefully received

Thanks

Danny

Upvotes: 0

Views: 3390

Answers (3)

David Spector
David Spector

Reputation: 1671

One case where you don't and can't get a line break after <h1> is if you put the <h1> inside of a flex container (display:flex). In this case, it is treated as one of the flex items and arranged on the page as specified by justify-content and align-items or their defaults. Flex lines are lines of blocks, not lines of text.

Upvotes: 0

Chuck Le Butt
Chuck Le Butt

Reputation: 48758

A h1 tag is a block element. It already has a "line break" before and after it. If you wish to increase the space above and below the element, use margin.

eg.

h1 {
    margin-top: 10px;
    margin-bottom: 10px;
}

You should not use <br> for styling. You should use CSS, and you'll have a lot more control, too.

Upvotes: 2

J. Robinson
J. Robinson

Reputation: 929

What you're talking about is referring to HTML not CSS. You can use the
tag in HTML to accomplish this.

<body>
  some text
  <br>
    <h1>Some Title</h1>
  <br>
  some more text
</body>

Upvotes: -1

Related Questions