아미나 질문입니다. 메뉴바 길이를 짧게 하고 싶습니다.
본문
메뉴바를 젤 상단에 가운데에 넣고 싶은데요 그럴려면 메뉴바 길이를 짧게 해야할것같은데 어떻게 해야하나요?
아미나 젤 상단에 보면
상단 즐겨찾기/구독/날짜 (여기에 메뉴바를 넣고 싶습니다.) 로그인/회원가입/즐겨찾기 등
답변 2
css 로 줄이면되요 우선 개발자 도구로 그부분 클릭해서 오른쪽 버튼 누르면 개발자도구 열어서 확인해야되요
유튜브로 개발자도구 활용방법 찾아보세요
개발자 도구 열고 하나하나 다 수정 해보고 해도 길이부분은 없더라구요
glitter0gim 님의 답변 참고해보세요
저는 직접 보고 알려드리려 했는데 이분이 제일 답변 잘 달아놨네요
※ 아래와 같이 수정하시면,
최상단 바가 프로젝트 전반에 걸쳐 일관된 스타일로 표시될 것입니다
※ 아미나빌더를 추가하실 때 생성된 헤더파일을 아래의 소스를 참고로 수정하세요.
(ex : header.php 또는 header.sub.php ; 아니면 님이 커스터마이징한 이름)
<div class="top-bar">
<span class="top-item">즐겨찾기</span>
<span class="top-item">구독</span>
<span class="top-item">날짜: <?php echo date('Y-m-d'); ?></span>
<nav class="top-menu">
<ul>
<li><a href="/page1.php">메뉴1</a></li>
<li><a href="/page2.php">메뉴2</a></li>
<li><a href="/page3.php">메뉴3</a></li>
</ul>
</nav>
<span class="top-item"><a href="/login.php">로그인</a></span>
<span class="top-item"><a href="/register.php">회원가입</a></span>
</div>
※ project의 메인 CSS에 추가
.top-bar {
display: flex;
justify-content: space-around;
align-items: center;
padding: 10px;
background-color: #f8f9fa;
}
.top-menu {
flex-grow: 1;
text-align: center;
}
.top-menu ul {
display: inline-flex;
list-style-type: none;
padding: 0;
}
.top-menu ul li {
margin: 0 15px;
}
.top-menu ul li a {
text-decoration: none;
color: #333;
font-weight: bold;
}
.top-item {
margin: 0 10px;
font-size: 14px;
}
답변을 작성하시기 전에 로그인 해주세요.
