Home > Enterprise >  HTML div span two columns and two rows
HTML div span two columns and two rows

Time:12-16

My question is really basic I guess but I'm more BE guy so FE is a black magic for me. I've got Ruby on Rails app where front-end part is a standard Rails view (HTML with some ruby part). I want add into existing spanned card additional row to have something like below:

Current view:

Issued: test         Expires: 01/01/1900

I want add additional line to be:

Issued: test         Expires: 01/01/1900
Terminal             Rec Expires: 01/01/2000

Here is my code

<div >
  <div >
    <span>Issued: test</span>
  </div>
  <div >
    <span>Expires: 01/01/1900 %></span>
  </div>
  <div >
    <span>Terminal</span>
  </div>
  <div >
    <span>Rec Expires: 01/01/2000</span>
  </div>
</div>

But instead of expected result I'm getting:

Issued: test         Expires: 01/01/1900
Terminal
Rec Expires: 01/01/2000

CodePudding user response:

..so you need add row and fix col- classes for 12 columns (look at engineersmnky comment )

<div >
  <div >
    <span>Issued: test</span>
  </div>
  <div >
    <span>Expires: 01/01/1900 %></span>
  </div>
</div>
<div >
  <div >
    <span>Terminal</span>
  </div>
  <div >
    <span>Rec Expires: 01/01/2000</span>
  </div>
</div>

if you need equal width of columns, you must set col-md-6 instead col-md-5 and col-md-7 and col-xs respectively

  • Related