Dasmoto Project - How to prevent break in paragraph with span class?

[ninayfp]

I’m working on the Dasmoto’s Arts & Crafts project, following this spec sheet.

I have managed to style everything correctly according to the spec sheet (yay!), however, the prices (e.g. “Starting at $3.00 / brush.”) on my project appear on a second line, whereas the spec sheet has the price on the same line as the rest of the paragraph.

Below is a screenshot of my site:

Below is my html code for this section:

<p>Made of the highest quality oak, Hacksaw brushes are known for their weight and ability to hold paint in large amounts. Available in different sizes. <span class="price">Starting at $3.00 / brush.</span></p>

How can I prevent the break in paragraph? Thanks!

[mtf]

It should remain inline by default unless the display property has been set to block. Just for the fun of it, don’t change the CSS, yet, but move the full stop from the end of the span text to just before the </p>.

Eg.

<span class="price">Starting at $3.00 / brush</span>.</p>

Take another screenshot and post in a reply. If the span is a block, the period should appear on the next line. That will confirm my suspicions.

[ninayfp]

Your suspicions were correct! I moved the full stop and it dropped to the next line:

I double checked my CSS and found the display: block. Removing it fixed the issue!

Thanks for your help