Please see the attached image. I want to recreate the same layout using bootstrap.
How can this be possiable? I can easily create the layout using bootstrap but i have no idea how to create the lines connected to the section.
You can draw lines with ::before and ::after pseudo elements.
Here's a little demo. It's not exactly your layout and I've used a fixed layout, but if yours is fluid (percentage based) then it's also doable. It's only a bit more tricky to do the math and some widths of the pseudo elements needs to be in percentage as well.
Thanks gentlemedia for sharing this code. I was also facing some difficulties which connecting such lines .
As gm states, this is fixed. You're probably designing as RWD, so mobile view would probably have to be a stacked option (or even a filelist-like structure) - so you may need to wrap the css in a media query.