How to prevent line breaks in this case ? HTML

September 18, 2022

<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 class="styled_dates"> 11/07/2022 </p> 
    <p> <strong>Deutschland</strong> <p class="styled_dates"> 23/05/2019 </p>
    <p> <strong>Erasmus</strong> <p class="styled_dates"> 23/06/1999 </p>
    <p> <strong>Work</strong> <p class="styled_dates"> 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

>Solution :

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.

<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>
        <span class="styled_dates">11/07/2022</span>
    </p> 
    <p>
        <strong>Deutschland</strong>
        <span class="styled_dates">23/05/2019</span>
    </p>
    <p>
        <strong>Erasmus</strong>
        <span class="styled_dates">23/06/1999</span>
    </p>
    <p>
        <strong>Work</strong>
        <span class="styled_dates">04/07/2003</span>
    </p>

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