Search code examples
csscross-browserpositioning

change width on h3 element

Why is the tag displaying incorrectly in chrome but not in firefox? In firefox the word baltimore doesn't show on the next line.

<h3>Hill’s Garage<br>
<span> Nissan and Infiniti Mechanic in Baltimore</span></h3>

This is the page in question. http://hillsgarage.net/wpdir

Thanks in advance for your help.

enter image description here

Solution

  • They look the same to me as well. It is probably a specific version issue.

    However, I would guess it might have something to do with nesting a <br> inside of an <h3>, and also nesting a <span> inside there.

    You should probably use something like 

    <h3>Hill’s Garage</h3>
<span> Nissan and Infiniti Mechanic in Baltimore</span>

    or 

    <h3>Hill’s Garage</h3>
<h4>Nissan and Infiniti Mechanic in Baltimore</h4>

    At the very least, one of these methods will most likely get rid of that problem, even though I'm not sure what's causing it.

    Additionally, you should always close your <br> tags like this: <br/>

    You could also assign a class or id to the span, if you wanted to make sure that only that span was affected by your style rules.