0
イメージを給付段落の下に整列しようとしていますが、何らかの理由でそこに配置することができません。私は背景位置を使用しました：％％;私が段落よりも低くなるように変更すると、私のイメージが隠れて、セクションにもっと高さをつけても、イメージはあまり表示されません。CSS段落の下の段落を整列する
私はだけなので、このプロジェクトのHTML、CSSの背景プロパティを操作する必要はなく、（CSSを使用させていただいております。
/*derde section*/
.participation h3 {
font-family: fraktur;
font-weight: 100;
font-size: 10em;
width: 50%;
color: #4A4A4A;
text-align: left;
}
.participation {
/* width: 80%; */
display: grid;
grid-template-columns: 1fr;
margin: 50px auto;
/* border: 2px solid #000000; */
background-image: url('../images/peace.png');
background-repeat: no-repeat;
background-size: contain;
background-position: 13% 82%;
justify-items: end;
}
.participation p {
width: 47%;
margin: 15px 40px;
}
.benefits h3 {
font-family: baskerville;
font-weight: 100;
font-size: 10em;
width: 50%;
color: #000000;
text-align: left;
}
.benefits {
/* width: 80%; */
display: grid;
grid-template-columns: 1fr;
margin: 50px auto;
background-image: url('http://thomasdebelder.be/zengarden%20website//images/kop2.png');
background-repeat: no-repeat;
background-size: contain;
background-position: right bottom;
justify-items: end;
}
.benefits p {
width: 47%;
margin: 15px 40px;
}
/*einde derde section*/<div class="participation" id="zen-participation" role="article">
\t \t \t <h3>Participation</h3>
\t \t \t <p>Strong visual design has always been our focus. You are modifying this page, so strong <abbr title="Cascading Style Sheets">CSS</abbr> skills are necessary too, but the example files are commented well enough that even <abbr title="Cascading Style Sheets">CSS</abbr> novices can use them as starting points. Please see the <a href="http://www.mezzoblue.com/zengarden/resources/" title="A listing of CSS-related resources"><abbr title="Cascading Style Sheets">CSS</abbr> Resource Guide</a> for advanced tutorials and tips on working with <abbr title="Cascading Style Sheets">CSS</abbr>.</p>
\t \t \t <p>You may modify the style sheet in any way you wish, but not the <abbr title="HyperText Markup Language">HTML</abbr>. This may seem daunting at first if you’ve never worked this way before, but follow the listed links to learn more, and use the sample files as a guide.</p>
\t \t \t <p>Download the sample <a href="/examples/index" title="This page's source HTML code, not to be modified.">HTML</a> and <a href="/examples/style.css" title="This page's sample CSS, the file you may modify.">CSS</a> to work on a copy locally. Once you have completed your masterpiece (and please, don’t submit half-finished work) upload your <abbr title="Cascading Style Sheets">CSS</abbr> file to a web server under your control. <a href="http://www.mezzoblue.com/zengarden/submit/" title="Use the contact form to send us your CSS file">Send us a link</a> to an archive of that file and all associated assets, and if we choose to use it we will download it and place it on our server.</p>
\t \t </div>
\t \t <div class="benefits" id="zen-benefits" role="article">
\t \t \t <h3>Benefits</h3>
\t \t \t <p>Why participate? For recognition, inspiration, and a resource we can all refer to showing people how amazing <abbr title="Cascading Style Sheets">CSS</abbr> really can be. This site serves as equal parts inspiration for those working on the web today, learning tool for those who will be tomorrow, and gallery of future techniques we can all look forward to.</p>
\t \t </div>
より：このようなhttp://thomasdebelder.be/test.pngは、私の場合には動作しません – Distortion