我的html頁面幾乎是應該如此工作,但我一直在滾動通過stackoverflow,似乎無法找到任何具體針對我的答案。html容器滾動錯誤
body {
\t \t \t \t width: 100%;
\t \t \t \t height: 100%;
\t \t \t \t padding: 0;
\t \t \t \t margin: 0;
\t \t \t \t border: 0;
\t \t \t }
\t \t \t h1 {
\t \t \t \t font-family: arial;
\t \t \t \t color: rgb(128, 128, 128);
\t \t \t \t text-align: center; \t
\t \t \t \t margin: 0;
\t \t \t \t overflow: auto; \t
\t \t \t }
\t \t \t header {
\t \t \t \t margin: 0;
\t \t \t \t width: 100%;
\t \t \t \t top: 0; left: 0;
\t \t \t \t padding: 0;
\t \t \t \t height: 30%;
\t \t \t \t position: fixed;
\t \t \t \t line-height: 350%;
\t \t \t \t background: black;
\t \t \t \t background-image: url(profile_pic.jpg);
\t \t \t \t background-repeat: no-repeat;
\t \t \t \t background-position: right;
\t \t \t \t background-size: 20% 70%;
\t \t \t \t color: rgb(190, 190, 190);
\t \t \t \t text-align: center;
\t \t \t \t border-spacing: 5px 10px;
\t \t \t \t border: 1px solid black;
\t \t \t }
\t \t \t nav {
\t \t \t \t display: flex;
\t \t \t \t text-align: center;
\t \t \t \t height: 25px;
\t \t \t \t position: fixed;
\t \t \t \t top: 30%;
\t \t \t \t width: 100%;
\t \t \t \t background: rgb(80, 80, 80);
\t \t \t \t border: 1px solid rgb(80, 80, 80);
\t \t \t }
\t \t \t .nav_link {
\t \t \t \t flex-grow: 1;
\t \t \t \t line-height: 25px;
\t \t \t \t
\t \t \t }
\t \t \t a {
\t \t \t \t text-decoration: none;
\t \t \t \t color: white;
\t \t \t }
\t \t \t a:hover {
\t \t \t \t text-decoration: underline;
\t \t \t }
\t \t \t .content {
\t \t \t \t width: 100%;
\t \t \t \t overflow-y: scroll;
\t \t \t \t height: 100%;
\t \t \t \t margin: 20% 0% 0% 0%; \t
\t \t \t \t padding-top: 6%;
\t \t \t }
\t \t \t .myPanel {
\t \t \t \t border: 1px solid black;
\t \t \t \t border-radius: 7px 7px 7px 7px;
\t \t \t \t box-shadow: 0px 0px 4px 999;
\t \t \t \t width: 45%;
\t \t \t \t margin: 1%;
\t \t \t }
\t \t \t .myPanel .heading {
\t \t \t \t background: rgb(80, 80, 80);
\t \t \t \t border-radius: 5px 5px 0px 0px;
\t \t \t \t color: white;
\t \t \t \t padding: 5px 20px;
\t \t \t }
\t \t \t .myPanel .panelBody {
\t \t \t \t padding: 3px 20px;
\t \t \t \t background: silver;
\t \t \t \t border-radius: 0px 0px 5px 5px;
\t \t \t }
\t \t \t .myPanel p {
\t \t \t \t margin: 3px;
\t \t \t }
\t \t \t .myPanel:hover {
\t \t \t \t box-shadow: 0px 0px 8px black;
\t \t \t }
<?php include 'head.php';?>
<body>
\t <header>
\t \t <h1>Resume</h1>
\t </header>
\t <nav>
\t \t <div class="nav_link">
\t \t \t <a href="index.php"> Home </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="resume.php"> Resume </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="sideprojects.php"> Side Projects </a>
\t \t </div>
\t \t <div class="nav_link">
\t \t \t <a href="aboutme.php"> About Me </a>
\t \t </div>
\t </nav>
\t <div class="content">
\t \t <div class="myPanel">
\t \t \t <div class="heading">US ARMY NATIONAL GUARD</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t <p>03/2014 -- Current</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t <p>Crystal River, FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Rank: PV2</ui></br>
\t \t \t \t \t \t \t \t <ui>Diesel Mechanic -- 91H</ui></br>
\t \t \t \t \t \t \t \t <ui>Military Police -- 31b</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">LILLYS ON THE LAKE</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t \t <p>06/2016 -- 02/2017</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t <p>Clermont FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Serving</ui></br>
\t \t \t \t \t \t \t \t <ui>Bartending</ui></br>
\t \t \t \t \t \t \t \t <ui>Service bar</ui></br>
\t \t \t \t \t \t \t \t <ui>Card Holder voids/comps</ui></br>
\t \t \t \t \t \t \t \t <ui>Open/close</ui></br>
\t \t \t \t \t \t \t \t <ui>Food running</ui></br>
\t \t \t \t \t \t \t \t <ui>Expediting</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">PANE D'OR</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t \t <p>08/2015 -- 06/2016</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t <p>Winter Garden FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Baking</ui></br>
\t \t \t \t \t \t \t \t <ui>Pastry</ui></br>
\t \t \t \t \t \t \t \t <ui>Delivering</ui></br>
\t \t \t \t \t \t \t \t <ui>Sales at markets/shop</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">Disney</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t \t <p>06/2015 -- 11/2016</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p class>
\t \t \t \t \t \t \t <p>Orlando FL</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Monorail pilot</ui></br>
\t \t \t \t \t \t \t \t <ui>Platform operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Audience control</ui></br>
\t \t \t \t \t \t \t \t <ui>Customer relations</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">PERFORMANCE YEARS GTO</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t \t <p>01/2012 -- 02/2015</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t <p>Hatfield PA</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Shipping</ui></br>
\t \t \t \t \t \t \t \t <ui>Receiving</ui></br>
\t \t \t \t \t \t \t \t <ui>Pulling/packing/sorting</ui></br>
\t \t \t \t \t \t \t \t <ui>Picker operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Forklift operator</ui></br>
\t \t \t \t \t \t \t \t <ui>Customer service</ui></br>
\t \t \t \t \t \t \t \t <ui>In house sales</ui></br>
\t \t \t \t \t \t \t \t <ui>Show sales</ui></br>
\t \t \t \t \t \t \t \t <ui>Inventory</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t \t <div class="myPanel">
\t \t \t <div class="heading">GIANT FOODS</div>
\t \t \t \t <div class="panelBody">
\t \t \t \t \t <p>01/2012 -- 03/2013</p>
\t \t \t \t \t <div class="showOnHover">
\t \t \t \t \t \t <p>
\t \t \t \t \t \t \t <p>Montgomeryville PA</p>
\t \t \t \t \t \t \t <ul>
\t \t \t \t \t \t \t \t <ui>Stocking shelves</ui></br>
\t \t \t \t \t \t \t \t <ui>Rotate merchandise</ui></br>
\t \t \t \t \t \t \t </ul>
\t \t \t \t \t \t </p>
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div>
</body>
所以用小提琴對其稍加修改,以在該應用程序。唯一的區別是我使用一些PHP爲我的電腦上的標題和導航欄形成模板。
好吧,如果你查看小提琴的滾動條不僅是我想滾動的區域,而是整個頁面。我想保持頭部固定,並有「身體」或爲我的網頁容器滾動,但沒有在頁面的全長滾動條。
爲什麼第一面板的'DIV content'但另一些不是孩子? –
我不知道?他們都應該是! –
在你的問題中發表一個[mcve]請 – j08691