• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 274
  • Last Modified:

align 2 spans in div horizontally

Hello All,

IS there a way I can align two spans with   in between in a div to align horizontally

Thank you.
0
dojjol
Asked:
dojjol
  • 2
1 Solution
 
Gurvinder Pal SinghCommented:
<div>
  <span style="padding-right:2px;">column1</span>
  <span>column2</span>
</div>
0
 
dojjolAuthor Commented:
Thanks gurvinder372. It worked.

But if I enhance the situation like:

In a div I have 4 spans, in which two spans should be aligned horizontally and two vertically, this fails like

<div>
  <span style="padding-right:2px;">column1</span>
  <span>column2</span>
  <span style="padding-right:2px;">column3</span>
  <span>column4</span>
</div>

Can it be possible to have column 3 display under coulmn 1 and coulmn 4 under coulmn 2.

Thanks and appreciated

0
 
Gurvinder Pal SinghCommented:
add a <br> after second column
0
 
Andrew DerseIT ManagerCommented:
Yes I would change it like this:

<div>
  <span style="padding-right:2px;">column1</span>
  <span>column2</span><br />
  <span style="padding-right:2px;">column3</span>
  <span>column4</span>
</div>

The spans will keep appending to the "row" that they are in.  Once you insert a <br /> then it will start a new "row" for you to put more <span>'s in.
0

Featured Post

Take Control of Web Hosting For Your Clients

As a web developer or IT admin, successfully managing multiple client accounts can be challenging. In this webinar we will look at the tools provided by Media Temple and Plesk to make managing your clients’ hosting easier.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now