简体   繁体   中英

Spacing after text in html/css

so I do not know why adding padding or even margin is not creating extra space after the text.

Output:

在此处输入图像描述

I want space after the Stay Tuned text and I tried adding padding and margin but it still did not work. What seems to be the issue? Any suggestions?

Code of that text:

 @import url('https://fonts.googleapis.com/css?family=Montserrat'); body { background: transparent; }.title123 { font-family: "Montserrat"; text-align: center; color: #FFF; letter-spacing: 1px; } h23 { background-image: url(https://media.tenor.com/images/ad3dbde6dd7863faeb8151178df7bc71/tenor.gif); color: transparent; -moz-background-clip: text; -webkit-background-clip: text; text-transform: uppercase; font-size: 35px; } /* styling my button */
 <link rel="stylesheet" href="assets/css/text.css"> <div class="title123"> <h23>Stay Tuned!</h23> </div>

Paddings and margins applies to block elements. You need to make your h23 element a block element - as it is not known HTML element it is rendered as inline by default.

You shouldn't use it at all...but you can if you really want - just if you need padding or margin make it block or inline-block adding to your CSS a rule like this:

h23 {
  display: inline-block;
}

h23 is not a HTML element. The heading tags are h1-h6 . If you change it to <h2> it will work. Then you can add a class and target that.

<h2 class="h23">Stay tuned!<h2>

Then in your css file

.h23 {
    margin-bottom: 1rem;
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM