Fix CSS so #left and #right don't overlap.
So that the elements in left don't go underneath right.
This commit is contained in:
parent
2c5617207a
commit
6986d56b71
1 changed files with 25 additions and 19 deletions
|
@ -17,55 +17,59 @@ body
|
|||
{
|
||||
display:flex;
|
||||
}
|
||||
#left
|
||||
#content_body
|
||||
{
|
||||
height:100%;
|
||||
flex: 1;
|
||||
}
|
||||
#left
|
||||
{
|
||||
flex: 1;
|
||||
height: auto;
|
||||
padding: 8px;
|
||||
}
|
||||
#description_text
|
||||
{
|
||||
padding: 8px;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
font-family: initial;
|
||||
}
|
||||
#right
|
||||
{
|
||||
width: 316px;
|
||||
}
|
||||
#right_inner
|
||||
{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
|
||||
position: fixed;
|
||||
top: 30px;
|
||||
right: 8px;
|
||||
bottom: 8px;
|
||||
top: 30px;
|
||||
|
||||
width: 300px;
|
||||
padding: 8px;
|
||||
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
#description_text
|
||||
{
|
||||
font-family: initial;
|
||||
padding: 8px;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
#editor_area
|
||||
{
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-direction: row;
|
||||
justify-content center;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
}
|
||||
#message_area
|
||||
{
|
||||
display: flex;
|
||||
flex: 2;
|
||||
flex-direction: column;
|
||||
justify-content center;
|
||||
align-items: center;
|
||||
flex: 2;
|
||||
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
|
@ -116,6 +120,7 @@ body
|
|||
</ul>
|
||||
</div>
|
||||
<div id="right">
|
||||
<div id="right_inner">
|
||||
<div id="editor_area">
|
||||
<input type="text" id="add_tag_textbox" autofocus>
|
||||
<button class="add_tag_button" id="add_tag_button" onclick="submit_tag(receive_callback);">add</button>
|
||||
|
@ -123,6 +128,7 @@ body
|
|||
<div id="message_area">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
|
Loading…
Reference in a new issue