blocks are appearing side by side when I believe they should be appearing one after another.

I noticed in Firebug that .grid12-1 is show up as 8.33%. Without this, blocks appear as expected, one after another.

Any idea why .grid12-1 would be set as 8.33%?

Thanks.

Comments

gajanannehul’s picture

gajanannehul CreditAttribution: gajanannehul commented

hi,
I am having same issue if anyone knows please help...

bdornbush’s picture

bdornbush CreditAttribution: bdornbush commented

My guess is that some of the magic of this theme is how it computes block width. While this works OK for desktop, it is not desirable for Mobile. I see that the grid12-fluid.css file appears last in the <head> section, so I edited it to set all grid widths to 100%:

/* grid widths */
.grid12-1 {width: 100%;}
.grid12-2 {width: 100%;}
.grid12-3 {width: 100%;}
.grid12-4 {width: 100%;}
.grid12-5 {width: 100%;}
.grid12-6 {width: 100%;}
.grid12-7 {width: 100%;}
.grid12-8 {width: 100%;}
.grid12-9 {width: 100%;}
.grid12-10 {width: 100%;}
.grid12-11 {width: 100%;}
.grid12-12 {width: 100%;}

Now the blocks are stacked vertically rather than being spread horizontally. Since I am only using Fusion for Fusion Mobile, I can get away with this. If I used it also for desktop, this wouldn't be desirable, and I would need to determine how Fusion places this css file last.