tirenweb
tirenweb

Reputation: 31709

Trying to apply inline-block to span

inline-block is not working for me here below.. no problem with block

<div class="delegacion" itemscope itemtype="http://schema.org/HomeAndConstructionBusiness">
  <h2>Delegación Madrid</h2>
  <span itemprop="streeAddress" class="new-line">Calle Guetaria 110</span>
  <span itemprop="postalCode">28041</span>
  <span itemprop="addressLocality" class="new-line">Madrid</span>
  <span itemprop="telephone" class="telephone new-line">
      <a href="tel:+683457946">683 457 946</a>
  </span>

CSS:

  span.new-line {
    display: inline-block;
  }

Upvotes: 0

Views: 50

Answers (2)

Cynthia
Cynthia

Reputation: 5403

If you are trying to have the .new-line items each be on their own line, then you have to use block instead of inline-block.

See jsFiddle here: http://jsfiddle.net/25VQa/

The short answer is that you need to use block.

Upvotes: 0

Vimal Stan
Vimal Stan

Reputation: 2005

You would generally use inline-block when you want an element to behave like an inline element but be able to respect properties such as height, width, top & bottom padding and margins.

Since you aren't setting any of those, you won't see a difference between inline and inline-block

Upvotes: 2

Related Questions