-5
私はHTMLとCSSには新しいですが、バグの問題に悩まされています。最初の応答性の高いウェブサイトを作成しましたが、サイズを小さくして右にスクロールすると、バックグラウンドのみが40〜50ピクセルの空きスペースがあります。私はそれを拡大するときに空の部分が消えることを追加する必要があります。手助け？Html empty right part
html {
width: 100%;
display: inline-block;
margin: 0px;
}
body {
margin: auto;
\t font-family: Arial;
\t background-image: url("weed.png");
margin-left: 0px;
margin-right: 0px;
}
/*Weedmania Logo*/
#weedmania_shade{
\t z-index: -1;
height: 255px;
width: 100%;
margin-left: 0px;
margin-top: 0px;
background-color: rgba(0,0,0,0.7);
}
#weedmania_logo_img {
margin-right: -120px;
margin-top: -405px;
\t height: 370px;
width: 90%;
min-width: 350px;
max-width: 800px;
}
/*Site Banner*/
#site_panel {
float: left;
\t background-image: url(weeds.jpg);
\t font-family: "Gigi Regular";
\t width: 98%;
\t color: green ;
\t border: 4px solid black;
\t padding: 5px;
margin-left: 6px;
margin-top: -175px;
}
#site_panel p {
font-style: italic;
text-shadow: 1px 2px black;
}
#site_panel h1 {
text-shadow: 1px 3px black;
}
/*Menu*/
nav {
\t float: left;
width: 10%;
max-width: 200px;
min-width: 100px;
height: 100px;
margin-top: 0px;
margin-left: 6px;
}
nav ul{
padding: 0;
background-color: green;
border: 2px solid black;
}
nav ul li {
list-style: none;
border : 1px solid lime;
padding : 5px;
}
nav ul li a{
\t color: lime;
\t list-style: none;
\t text-decoration: none;
font-family: "Arial";
font-style: italic;
}
nav ul li a:hover{
color : #ccffb3;
text-decoration: underline;
}
/*Leaves And Joint*/
#joint_figure #joint_img{
float: center;
border: 3px solid black;
margin-top: 0px;
width: 50%;
min-width: 157px;
}
#leaf_img_left{
float: left;
\t max-width: 300px;
width: 25%;
height: 30%;
margin-left: -30px;
margin-top: 10px;
}
#leaf_img_right{
float: right;
max-width: 300px;
width: 25%;
height: 30%;
margin-right: -30px;
margin-top: 10px;
}
#description{
\t
width: 50%;
height: 10%;
min-width: 300px;
font-size: 110%;
background-color: rgba(0,0,0,0.75);
}
#description_text{
color: rgba(255,255,255,0.5);
font-family: "Comic Sans MS";
padding-top: 2px;
text-align: center;
font-size: 83%;
}<!DOCTYPE html>
<html>
<head>
<title> WeedMania - Weed's biggest community </title>
<link rel="stylesheet" href="style.css">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width" contnet="initial-scale=1.0">
</head>
<body>
<div><nav>
<ul>
<li>
<a href="file:///D:/Shits/Web/Joint/altjoint.html">Index</a>
</li>
<li>
<a href="http://messywind.tumblr.com/">Good Trip</a>
</li>
<li>
<a href="https://www.facebook.com/alex.bmx27">Buy Weed</a>
</li>
</ul>
</nav></div>
<article><center><figure id="weedmania_shade"></figure></center></article>
<div><figure id="weedmania_logo"><center><img src="weedmania_logo.png" id="weedmania_logo_img" alt=""></center></figure></div>
<div><figure id="stop"></figure></div>
<div><article id="site_start">
<header id="site_panel">
<h1> Smoke Weed Everyday </h1>
<p> Posted by <strong>WeedMania</strong> </p>
</header>
<div><figure class="leaves">
<img id="leaf_img_left" src="leaf.png" alt="">
</figure></div>
<div><figure class="leaves">
<img id="leaf_img_right" src="leaf.png" alt="">
</figure></div>
</article></div>
<div><center><figure id="joint_figure">
<img id="joint_img" src="joint1.jpg" alt="">
</figure></center></div>
<center><article id="description">
<p id="description_text">This forum is designed to bring you the latest news about weed worldwide, informations about weed strains, smoking stories and , basically everything you need to know about weed. Feel free the create an account and join the community</p>
</article></center>
</body>
</html>
あなたは私たちの例を与えることができますか？文字通り何でもかまいません。文字、画像、div、パディング、アライメント... – Isaac
すべてのページが90％にスケールされているのと同じですが、10％は壁紙だけですが、ページを100％拡大すると空きスペースの10％満たされている – Alex27
それはちょうど漠然としています...違反コードを投稿しますか？ – Isaac