CODEWITHSUNDEEP
css
simpatico
simpatico

Reputation: 11107

How to center a word with respect to a paragraph?

Say I have the following text input:

 Essen Oxland Road, 34, LS4 7Du      
 Leeds, United Kingdom

How can I style to appear as:

enter image description here

Upvotes: 0

Views: 111

Answers (2)

Patrick Oscity
Patrick Oscity

Reputation: 54714

Use display:inline-block with vertical-align:middle

HTML

<span class="left">
    Essen
</span>
<span class="right">
    Oxland Road, 34, LS4 7Du<br>
    Leeds, United Kingdom
</span>

CSS

span.left, span.right {
  display: inline-block;
  vertical-align: middle;
}

Demo on JS Bin

Note that display:inline-block does not work properly in IE7 and lower.

Upvotes: 3

Prashobh
Prashobh

Reputation: 9552

.left {
      float:left;
      line-height: 2.0;
      }

    <span class="left">
        Essen
    </span>
    <span>
        Oxland Road, 34, LS4 7Du<br>
        Leeds, United Kingdom
    </span>

Upvotes: 0

Related Questions