With left menu I have problems with Bootstrap 4.1 pages layout

Questions and tutorials related to Cascading Style Sheets *all versions*

Moderators: egami, macek, gesf

Post Reply
php-forum Active User
php-forum Active User
Posts: 38
Joined: Sun Mar 30, 2014 4:45 am

Sat Jan 19, 2019 7:07 am

Hello all.
Could you please to look at layout of the Bootstrap 4.1 page:
http://demo2.nilov-sergey-demo-apps.tk/ ... ses/2/edit

It is under credentials admin@demo.com 111111
I made menu at left side by some sample(it must be hidden on small device).
But with this left menu there are some features I would like to fix :
1) I need page content (blue border) to be centered and it is ruled by styles :

Code: Select all

.wrapper {
  display: flex;
  align-items: stretch;
  border: 2px dotted red;
  margin-right: auto;
  margin-left: auto;
  padding: 0 !important;
#page-wrapper {
  margin-right: 10px;
  margin-left: 10px;
  padding: 0 !important;
  width: 100% !important;
  border: 1px solid blue !important;
  align-content: center;
Looks like the reason is in props display and align-items of wrapper class, but when I tried to modify these values
the left menu stopped working
2) Listing http://demo2.nilov-sergey-demo-apps.tk/admin/clients with many columns must be with horizontal scrolling,
but instead scrolling of table with data with syntax

Code: Select all

<div class="table-responsive">
    <div id="get-client-dt-listing-table_wrapper" class="dataTables_wrapper no-footer">

all page is moving by mouse move. Again I suspect that is because of left menu
How to fix it ?
Post Reply