search

kattunga / IWBootstrapFramework

Intraweb Bootstrap 3 Framework for Delphi
http://kattunga.github.io/IWBootstrapFramework
MIT License
98 stars 42 forks source link

Issue with grid system at runtime #30

Closed mtaki14 closed 7 years ago

mtaki14 commented 7 years ago

I am having a strange issue where the grid columns do not appear in the place where they are supposed to be.

bds_2016-12-27_08-50-05

bds_2016-12-27_08-49-50

As you can see, that although IWBSR2Right is supposed to be a sibling of IWBSR2Left, at runtime it appears as its child.

Any idea why that may be?

robertonicchi commented 7 years ago

Hello, i'm not very expert with Bootstrap but the max number of columns is 12. In your html code i see 6 * 3 = 18 columns. So the third column will start a new row. Maybe this is the problem you are seeing ? Roberto

mtaki14 commented 7 years ago

What you say is correct, a bootstrap grid is made up of 12 columns. And for some reason I end up with 3 siblings with 6 column spaces which is not what I have at design time.

This screenshot should better show what I have at design time:

bds_2016-12-27_12-24-44

...as opposed to what happens in the browser

bds_2016-12-27_12-23-20

As you can see this is really strange. For some reason rows 3 and 4 appear inside row 2 although this is clearly not the case at design time.

kattunga commented 7 years ago

Please attach a test case so I can compile and debug it.

mtaki14 commented 7 years ago

Hi, sorry for not getting back to you earlier but I got caught up in other work.

Here's a simple project with 1 form where the issue happens for me.

TestProject.zip

The divs "IWBSROW3" and "IWBSROW4" appear as a children of "IWBSROW2" at runtime although at design time you can see they are supposed to be siblings.

mtaki14 commented 7 years ago

Maybe I am doing something entirely wrong so please let me know if that is the case.

kattunga commented 7 years ago

mtaki,

The problem is that Html in IWBSRegion12 is malformed, you forgot to close the second div element. You need to be very carefull when you include raw HTML inside divs. I don't understand why you use all that raw HTML instead of using IWBoostrap components.

Regards

mtaki14 commented 7 years ago

Thanks for the reply and for figuring out my mistake.

The reason I was using so much raw html was because 1. I was simply experimenting with raw html and how it interacted with the components 2. If I remember correctly I was having some trouble making the labels appear on top of textboxes. I think I figured it out in the end but some of the previous forms with raw html were left behind.

Thanks again for your help.