내 CSS가 내 두 번째 요소에 영향을 미치지 않습니다 <section> 태그

Question

두 번째 섹션 태그를 만들기 전에이 코드가있는 다른 섹션이 있습니다. 여기 :

HTML

<div class="about-me-section"> 
<div class="about-me-overlay"> 
    <h1>Hi I'm Marielle,</h1> 
    <p>A web developer and self-enthusiast</p> 
</div> 
</div> 

이제 CSS

.about-me-section { 
background: url(https://images.unsplash.com/photo-1498622601663-8277ceda5cb6?auto=format&fit=crop&w=791&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D); 
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat; 
    width: 100%; 
    height: 100vh; 
    position: relative; 
    display: flex; 
    flex-wrap: wrap; 
    justify-content: center; 
} 

.about-me-section::before { 
    content: ''; 
    position: absolute; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    background: #0a1725; 
    opacity: .94; 
    z-index: 0; 
} 

.about-me-overlay { 
    flex: 1; 
    margin: auto; 
    color: white; 
    text-align: center; 
    z-index: 6; 
} 

.about-me-overlay p { 
    font-size: 1.5rem; 
} 

나는 패딩, 마진, 높이를 추가하거나 폭있을 때, 나는 나의 두 번째 섹션 태그를 설계 해요 내 CSS에서 변경 한 내용을 표시하지 않습니다.

HTML

<section id="background-technologies"> 
<div class="techno-wrapper"> 
<h1>Services <hr class="header-style-bottom-2"></h1> 
</div> 
</section> 

CSS

#background-techonologies section { 
    max-width: 100%; 
    margin: 0; 
    padding: 0 2em; 
} 

#background-technologies h1 { 
    text-align: center; 
} 

#background-technologies .techno-wrapper { 
    margin: 0; 
    width: 100%; 
} 

는 여기에 귀하의 CSS에 당신은 맞춤법 오류가 내 크롬 개발 도구 link here

Answer 1

에서 디스플레이의 스크린 샷입니다. 귀하의 HTML 섹션 ID는 "# background-technologies"이지만 귀하의 CSS에서는 "# background-techonologies"입니다.