Erblin Krasniqi
Erblin Krasniqi

Reputation: 39

How do I align text in the same line?

I'm trying to get this text to be in the same line but I'm not getting the hang off it

#logo {
  margin      : 0;
  padding     : 0;
  font-family : 'Dosis', sans-serif;
  font-weight : 300;
  text-align  : center;
  width       : 50%;
}
<h1 id="logo">This text
  <p>should be inline</p>
</h1>

Upvotes: 0

Views: 2061

Answers (4)

Link Strifer
Link Strifer

Reputation: 565

About that, use a span instead of a paragraph.

By default, paragraphs have display: block, so they will be in a new line, you can modify that part but a paragraph inside a title doesn't make sense

We use span for this kind of scenario, not sure why you need to wrap the should be inline inside a new element but span is the element you need for most font styling use cases

Upvotes: 2

Florian Becker
Florian Becker

Reputation: 113

I see a lot of answers stating the <p> tag should be replaced with a <span> and that is correct in most cases.

HOWEVER:

if you want to keep your setup with a <p> (which you probably shouldn't cause it makes no sense from another programmers-view), you can also giv the <p> tag a style. Use display: inline for forcing the <p> tag to behave like a <span>.

Upvotes: 1

Anonymous
Anonymous

Reputation: 557

can you try this :

 <!DOCTYPE html>
    <html>
        <head>
            <link rel="stylesheet" href="design.css">
        </head>
        <body>
          <h1 id="logo">This text<span>should be inline</span></h1>
        </body>
    </html>

Upvotes: 1

3nt3
3nt3

Reputation: 329

<p> is short for "paragraph" and thus creates a new paragraph. If you want both to be in the same paragraph, replace <p> with <span> like so:

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="design.css" />
  </head>
  <body>
    <h1 id="logo">
      This text
      <span>should be inline</span>
    </h1>
  </body>
</html>

You could also change the default stylesheet for <p> probably so that it behaves like <span> but that would be more complicated imo.

Upvotes: 0

Related Questions