index.php에서 include한 quick메뉴 css가 안읽힙니다 ㅠ
본문
문제 이미지입니다.
theme/theme/index.php 에서
<?php
include_once('./quickmenu.php');
?> 하였습니다
지금 css를 읽긴하는데 어딘가에 문제가생긴거같습니다..
서버주소는 http://rlawjdrb01.dothome.co.kr/ 입니다
css quick 소스입니다
/** 퀵메뉴 **/
.quick-menu {
position: fixed;
top: 50%;
left: auto;
right: 0;
transform: translateY(-50%);
width: 300px;
height: 52%;
}
.quick-menu > .quick-top {
background: linear-gradient(to right, #d6be8f, #eaddba, #c09364);
border-top-right-radius: 20px;
border-top-left-radius: 20px;
padding: 20px 30px;
}
.quick-menu > .quick-top > ul > li {
width: 50%;
text-align: center;
}
.quick-menu > .quick-top > ul > li > .img-box {
width: 89px;
}
.quick-menu > .quick-top > ul > li > h1 {
font-weight: 200;
font-size: 24px;
letter-spacing: -2px;
display: block;
vertical-align: baseline;
white-space: nowrap;
}
.quick-menu > .quick-section {
background-color: #000;
color: #fff;
padding: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
}
.quick-menu > .quick-section > form {
position: relative;
padding-bottom: 60px;
}
.quick-menu > .quick-section > form > ul:not(:first-child) {
margin-top: 20px;
}
.quick-menu > .quick-section > form > ul > li:first-child {
width: 30%
}
.quick-menu > .quick-section > form > ul > li:last-child {
width: 65%;
}
.quick-menu > .quick-section > form > ul > li > span {
display: block;
width: 70px;
font-weight: 200;
line-height: 36px;
}
.quick-menu > .quick-section > form > ul > li > input {
width: 100%;
background-color: transparent;
border: 2px solid #fff;
outline: none;
color: #fff;
padding: 10px 0;
padding-left: 5px;
}
.quick-menu > .quick-section > form > button {
position: absolute;
top: auto;
bottom: 0;
width: 250px;
height: 20px;
left: 50%;
transform: translateX(-50%);
background: linear-gradient(to right, #d6be8f, #eaddba, #c09364);
border: none;
cursor: pointer;
height: auto;
padding: 10px 0;
border-radius: 50px;
outline: none;
}
.quick-menu > .quick-section > form > button > span {
line-height: 0;
font-size: 18px;
display: block;
padding: 10px 0;
letter-spacing: -1px;
font-weight: 600;
}
.quick-menu > .call {
width: 80%;
text-align: center;
background: linear-gradient(to right, #d6be8f, #eaddba, #c09364);
border: none;
height: 50px;
position: absolute;
left: 50%;
transform: translateX(-50%);
height: 70px;
border-radius: 50px;
margin-top: 10px;
cursor: pointer;
outline: none;
}
.quick-menu > .call > span {
display: block;
font-weight: 300;
letter-spacing: -1px;
font-size: 12px;
}
.quick-menu > .call > span:last-child {
font-family: tmon;
font-size: 30px;
}
.quick-menu > .kakao {
width: 200px;
position: absolute;
left: auto;
right: 0;
bottom: 19%;
}
.quick-menu > .kakao > span {
position: absolute;
left: auto;
background-color: white;
padding: 17.5px 35px;
width: 100px;
right: 10px;
top: 0px;
border-radius: 50px;
z-index: 0;
cursor: pointer;
padding-left: 20px;
font-weight: 600
}
.quick-menu > .kakao > .circle {
width: 31px;
background: linear-gradient(to right, #d6be8f, #eaddba, #c09364);
border-radius: 50%;
padding: 15px;
position: absolute;
right: 0;
cursor: pointer;
}
.quick-menu > .kakao > .circle > .img-box {
width: 31px;
}
.quick-menu > .quick-bottom {
margin-top: 160px;
}
.quick-menu > .quick-bottom > span {
display: block;
text-align: right;
font-size: 12px;
cursor: pointer;
color: #b29977;
}
답변 1
http://rlawjdrb01.dothome.co.kr/theme/st-basic/css/index.css
위 css는 정상적으로 불러와지고 있습니다.
원하시는 모양이 정확히 뭔지 모르겠지만 아래 4가지 CSS를 수정해보세요.
.quick-menu > .kakao{position:relative;display:inline-block;width:200px;margin-top:100px;}
.quick-menu > .kakao > span {position:absolute;left:auto;background-color:white;padding:11px 35px;width:100px;right:10px;height:60px;top:0px;border-radius:50px;z-index:0;cursor:pointer;padding-left:20px;font-weight:600;}
.quick-menu > .kakao > .circle {background:linear-gradient(to right, #d6be8f, #eaddba, #c09364);border-radius:50%;padding:15px;position:absolute;right:-20px;cursor:pointer;}
.quick-menu > .quick-bottom {margin-top:70px;}
.quick-menu > .quick-bottom > span {display:block;text-align:center;font-size:12px;cursor:pointer;color:#b29977;}