您如何使整个内容内容全屏显示,而不仅仅是覆盖屏幕的3/4

时间:2019-06-21 03:37:08

标签: html css

我有此页面:问题是白色部分下方有一个空白空间。我想要的是将上部内容(sidebar-nav和main-content)扩展为整页。

enter image description here

<section id="left-sidebar-panel">
    <div id="left-panel-content">
        <img id="pictureShadow" src="/assets/images/main-photo.jpg">
        <nav id="menu-links" >
            <ul class="inline-block">
                <li class="mb-4 mt-4 text-white">
                    <a href="/" class="text-3xl font-light flex" id="homePage">
                        @include("svgs.home")
                        Home
                    </a>
                </li>

                <li class="text-white mb-4">
                    <a href="/blogs" class="text-3xl hover:text-3xl flex" id="blogsPage">
                        @include("svgs.post")
                        Blogs
                    </a>
                </li>

                <li class="text-white mb-4">
                    <a class="text-3xl mt-2 flex" href="/podcasts"  id="podcastsPage">
                        @include("svgs.microphone")
                        Podcasts
                    </a>
                </li>

                <li class="text-white mb-4">
                    <a class="text-3xl flex" href="/work">
                        @include("svgs.laptop")
                        Work
                    </a>
                </li>

                <li class="text-white mb-4">
                    <a class="text-3xl flex" href="/side-projects">
                        @include("svgs.projects")
                        Side Projects
                    </a>
                </li>
            </ul>
        </nav>
    </div>
</section>


<p class="text-xl text-normal">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sed consequatur praesentium aliquid unde, debitis sit vel velit distinctio eligendi, nesciunt illum totam ad repudiandae. Pariatur dolor totam omnis eos eius ab debitis reprehenderit dicta, quidem, deleniti? Natus consequatur eum vel voluptatem illum doloremque dolores, id voluptatibus quas nam officia cumque dolor in, nobis maiores alias. Repellendus molestias quia nisi voluptas est voluptate ab quam voluptatum! Atque sequi magnam et iure sunt molestias ipsum odit ad repellendus reprehenderit hic temporibus possimus, totam eligendi quas amet accusantium dolores quibusdam dolorem, corrupti placeat perspiciatis animi velit. Odit quisquam ipsum voluptate quibusdam, et, placeat iure dolorum, expedita quia soluta cupiditate. Dicta cupiditate neque minus excepturi consectetur et, exercitationem fugit at enim ex libero. Debitis, omnis modi harum quisquam. Dicta, est esse fuga dolor doloremque architecto velit magnam eos nesciunt et natus ullam quasi error, eligendi. Autem dolorum debitis reiciendis alias atque fugiat aperiam soluta?</p>

0 个答案:

没有答案