# How to management layout-grid : (CSS) \[Issue\]

**URL:** <https://community.plotly.com/t/how-to-management-layout-grid-css-issue/30039>\
**Category:** Dash Python\
**Created:** [October 14, 2019, 11:27pm UTC](https://community.plotly.com/t/how-to-management-layout-grid-css-issue/30039 "2019-10-14T23:27:39Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![ratarca](https://avatars.discourse-cdn.com/v4/letter/r/dc4da7/32.png) [@ratarca](https://community.plotly.com/u/ratarca)\
**Post date:** [October 14, 2019, 11:27pm UTC](https://community.plotly.com/t/how-to-management-layout-grid-css-issue/30039/1 "2019-10-14T23:27:39Z")

</div>

Hello I apologize I believe I found very similar questions however in none of them got an expected answer.  
First of all I have consulted all the basic documentation regarding layout and some links \* that I believe are very good as below.  
However I did not understand how the division of grids and containers within the plotly works - I am not a professional programmer just a hobbyist - I managed to solve my problem with the bootstrap module of our documentation however I am wondering how I use the combination of Divs and CSS using the IDs. of class for the example below.

Links:

> [@CSS Grid Layout](https://community.plotly.com/t/css-grid-layout/8431/3):
>
> Hi @nedned , I attach a Dash example and a codepen example which give different outputs. It looks like the display:grid format does not respect the grid tracks or span properly. Dash Code import dash import dash\_html\_components as html app = dash.Dash() app.layout = html.Div( className = ‘wrapper’, children=[ html.Div(html.H1( className=‘header-left’, children=‘LEFT’ ),), html.Div(html.H2( className=‘header-middle’, children =‘MIDDLE’, ),), html.Div(html.H1( className = ‘heade…

> [@Help with displaying two graphs in 1 row, 2 columns](https://community.plotly.com/t/help-with-displaying-two-graphs-in-1-row-2-columns/17132/7):
>
> thanks all for the great tips and tricks! for the time being I chose the solution from @giodcruz95 (easiest to implement) I’m also investigating the nice approach suggested by @tcbegley. However with the changes suggested by the author: dbc.Row([#Boxplot dbc.Col([dcc.Markdown('Select grouping variable'), dcc.Dropdown( id='group\_var', options=[{'label':i, 'value':i} for i in feats\_cat], …

 ![divs_layout](https://us1.discourse-cdn.com/flex024/uploads/plot/original/2X/d/dc9cc9bdc621effce6765fca7dd3cf89cdaecc47.png)

---

<div class="post-metadata">

**Author:** ![ratarca](https://avatars.discourse-cdn.com/v4/letter/r/dc4da7/32.png) [@ratarca](https://community.plotly.com/u/ratarca)\
**Post date:** [February 7, 2020, 2:23am UTC](https://community.plotly.com/t/how-to-management-layout-grid-css-issue/30039/2 "2020-02-07T02:23:10Z")

</div>

Nothing until now… ☹
