How to prevent line breaks in this case ? HTML-CodePudding

How browser shows "my" code

<html>
    <head>
        <title> chatter|app </title>

        <style>
            .styled_dates {
                font-size: 11px;
        
            }
        </style>
    
    </head>>
<body>
    <h1> chatter|app </h1>
    
    <h2> Favorites </h2>
    
    <p> <strong>Neversea</strong> <p > 11/07/2022 </p> 
    <p> <strong>Deutschland</strong> <p > 23/05/2019 </p>
    <p> <strong>Erasmus</strong> <p > 23/06/1999 </p>
    <p> <strong>Work</strong> <p > 04/07/2003 </p>

    <h2> Regular </h2>> 
</body>
</html>

Hello. Noobie here.

What I want to do: see the dates next to "Neversea, Deutschland, Erasmus, Work", not underneath them.

Neversea  11 07/2022

not...

Neversea
11/07/2022

How can I do that?

Thank you

CodePudding user response：

The issue is that <p> tags by default follow onto the next line. Also you have unclosed tags (each line you open 2 and only close 1)

In my code I use <span> elements, they are made for in-line styling/changes which seems appropriate for your use case.

.styled_dates {
  font-size: 11px;
}

<h1> chatter|app </h1>
<h2> Favorites </h2>
<p>
  <strong>Neversea</strong>
  <span >11/07/2022</span>
</p>
<p>
  <strong>Deutschland</strong>
  <span >23/05/2019</span>
</p>
<p>
  <strong>Erasmus</strong>
  <span >23/06/1999</span>
</p>
<p>
  <strong>Work</strong>
  <span >04/07/2003</span>
</p>
<h2> Regular </h2>