Claude Coulombe
Greetings folks,
I would like to stack all the content of my container (including the imbricated content) in one column as I've got using the original Bootstrap library.
A code snippet worths a thousand words:
Note : R1, C1 stands for Row 1, Column 1, IR1,IC2 stands for imbricated Row 1, imbricated Column 2
<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui"
xmlns:b="urn:import:com.github.gwtbootstrap.client.ui">
<g:HTMLPanel>
<b:FluidContainer>
<b:Row>
<b:Column size="3">
<b:Label>R1,C1</b:Label>
</b:Column>
<b:Column size="9">
<b:Row>
<b:Column size="7">
<b:Label>R1,C2 - IR1,IC1</b:Label>
</b:Column>
<b:Column size="2">
<b:Label>R1,C2 - IR1,IC2</b:Label>
</b:Column>
</b:Row>
<b:Row>
<b:Column size="7">
<b:Label>R1,C2 - IR2,IC1</b:Label>
</b:Column>
<b:Column size="2">
<b:Label>R1,C2 - IR2,IC2</b:Label>
</b:Column>
</b:Row>
</b:Column>
</b:Row>
</b:FluidContainer>
</g:HTMLPanel>
</ui:UiBinder> The CSS sheets are (in that order) :
<link type="text/css" rel="stylesheet" href="gwt-bootstrap.css">
<link type="text/css" rel="stylesheet" href="bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="bootstrap-responsive.min.css">
Renders like that when I shrink my window :
(in fact the right part is hidden when my window is very small)
But I would like to get something more like that (which I've got using the original Bootstrap):
I 've tried a lot of things, FluidRow, insert more than one FluidContainer, change the CSS (but I'm not a CSS expert).
Any help is welcome!
