footer jumps when the size of sidebar is lower than the top of the website.

tecnologiaterabyte commented 9 years ago

Hi, Excellent theme'm adapting the template to yii2, and had made in the previous version I changed all new classes and works well only the footer jump to reload the website, because the sidebar is smaller than the top of the screen.

Annex pictures:

Footer Jump in reload website:

admin-lte01

Footer after reload website is ok:

admin-lte02

kressly commented 9 years ago

Please which version of AdminLte are u using ? The footer has been fixed in the latest release You can download it from http://almsaeedstudio.com/themes/AdminLTE/AdminLTE2-dist.zip

tecnologiaterabyte commented 9 years ago

I install via composer "bower-asset/admin-lte": "dev-master".

almasaeed2010 commented 9 years ago

If you upgraded to the latest version then you should read the upgrade guide

tecnologiaterabyte commented 9 years ago

thanks for your reply,

My Code Main-Dashboard.php

<?php
    use yii\helpers\Html;
    use yii\widgets\Breadcrumbs;
    use backend\widgets\Alert;

    /* @var $this \yii\web\View */

?>

<?php $this->beginPage() ?>
    <!DOCTYPE html>
    <html lang="<?= Yii::$app->language ?>">
    <head>
        <meta charset="<?= Yii::$app->charset ?>"/>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <?= Html::csrfMetaTags() ?>
        <title><?= Html::encode($this->title) ?></title>
        <!-- Theme style -->
        <?php $this->head() ?>
        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
        <![endif]-->
    </head>
    <?php $this->beginBody() ?>
        <?php if (!\Yii::$app->user->isGuest): ?>
            <?php if (Yii::$app->user->can('Administrador')): ?>
                <body class="skin-blue">
                <!-- ./wrapper -->
                <div class="wrapper">
                    <!-- header logo: style can be found in header.less -->
                    <header class="main-header">
                        <!-- Add the class icon to your logo image or logo icon to add the margining -->
                        <?= Html::a('ChecktimeWeb v. 1.0.', \Yii::$app->homeUrl, ['class' => 'logo']) ?>
                        <!-- Header Navbar: style can be found in header.less -->
                        <nav class="navbar navbar-static-top" role="navigation">
                            <!-- Sidebar toggle button-->
                            <?= Html::a('<span class=sr-only>Toggle navigation</span><span class=icon-bar></span><span class=icon-bar></span><span class=icon-bar></span>','#', ['class' => 'sidebar-toggle', 'data-toggle'=>'offcanvas','role'=>'button']) ?>
                            <!-- User Account: style can be found in dropdown.less -->
                           <?= $this->render('_menuser') ?>
                        </nav>
                    </header>
                    <!-- Left side column. contains the logo and sidebar -->
                    <aside class="main-sidebar">
                        <!-- sidebar: style can be found in sidebar.less -->
                        <section class="sidebar">
                            <!-- Sidebar user panel -->
                            <div class="user-panel">
                                <div class="pull-left image">
                                    <?= html::img(\Yii::$app->session->get('user.avatar30'), $options = ['class' => 'img-rounded'], ['aria-expanded' => 'false']) ?>
                               </div>
                                <div class="pull-left info">
                                    <p><?= \Yii::$app->session->get('user.username') ?></p>
                                    <?= Html::a('<i class="fa fa-circle text-success"></i> Online','#') ?>
                                </div>
                           </div>
                           <!-- ./Sidebar user panel -->
                            <?= $this->render('_sidebar') ?>
                        </section>
                        <!-- /.sidebar -->
                    </aside>
                    <!-- ./Left side column. -->
                    <!-- Right side column. Contains the navbar and content of the page -->
                    <div class="content-wrapper">
                        <section class="content-header">
                            <!-- Content Header (Page header) -->
                            <div class="container">
                                <?= Breadcrumbs::widget([
                                    'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : [],
                                ]) ?>
                            </div>
                            <!-- ./Content Header -->
                        </section>
                        <section class="content">
                            <!-- Main content -->
                            <?= $content ?>
                            <?= Alert::widget() ?>
                            <!-- /.content -->
                        </section>
                    </div>
                    <!-- ./Right side column. -->
                   <?= $this->render('_footer') ?>
                </div>
                </body>
            <?php endif; ?>
        <?php endif; ?>
    <?php $this->endBody() ?>
    </html>
<?php $this->endPage() ?>

adminlte-viewcode

almasaeed2010 commented 9 years ago

You cannot use a container in the main content because the .content-wrapper creates that by default. Remove the container div and try again. When in doubt, consult the blank example page.

tecnologiaterabyte commented 9 years ago

I removed the div class = container, but just keep doing jumping footer, now does it faster I reviewed the example of the blank page and have all parts of the layout correctly, not if be any dependence on jquery or some .js file, jquery'm running v2.1.3, who else could verify and thank you very much, will wait to leave the paid version because it really worth it, and thus also help so that they can produce new themes.

tecnologiaterabyte commented 9 years ago

If you check the example of blank page on your website http://almsaeedstudio.com/themes/AdminLTE/pages/examples/blank.html really jumping footer, makes fast but jump reload page.

almasaeed2010 commented 9 years ago

I get what you mean now. Unfortunately there isn't a cross browser way to fix that except by adding a min height to the content which can be inconvenient since you will have to add that to every page that doesn't contain much content. Otherwise, you'll have to tolerate the jumping footer for now.

tecnologiaterabyte commented 9 years ago

no problem it just wanted you to have it present excellent upgrade to separate the skins, congratulations this being fine, thks.

lenamtl commented 9 years ago

You can use a sticky footer instead.

marcioferlan commented 7 years ago

Hello, guys!

I don't know if you guys are still facing this issue, but this CSS workaround seems to have worked for me:

<style>
  html { height: 100% !important; }
  body { height: 100% !important; padding-bottom: 30px; }
  .main-footer { position: fixed; left: 0; right: 0; bottom: 0; }
</style>

harshapower commented 6 years ago

add <?php include_once('footer.php') ?> at the end of index.php code.

ColorlibHQ / AdminLTE

footer jumps when the size of sidebar is lower than the top of the website. #226