diff --git a/WISCOM/src/components/Project/ImageSliderStyle.jsx b/WISCOM/src/components/Project/ImageSliderStyle.jsx index 0b93674..e5201ae 100644 --- a/WISCOM/src/components/Project/ImageSliderStyle.jsx +++ b/WISCOM/src/components/Project/ImageSliderStyle.jsx @@ -9,6 +9,11 @@ export const ImageSliderContainer = styled.div` position: relative; /* 부모 클래스에 relative 포지션을 추가 */ margin-bottom: 200px; + @media (min-width: 1441px) { + margin: 0 auto; /* 정렬 필수!!!!! */ + margin-bottom: 100px; + } + @media (max-width: 425px) { margin-bottom: 100px; } @@ -30,7 +35,10 @@ export const SliderBannerWrap = styled.div` margin-right: 10%; justify-content: center; - // margin: 0 auto; /* 필수!!!!! */ + + @media (min-width: 1440px) { + width: 1400px; + } `; export const SlideBanner = styled.div` diff --git a/WISCOM/src/components/Project/ProjectStyle.jsx b/WISCOM/src/components/Project/ProjectStyle.jsx index 7ff7276..6fae9c4 100644 --- a/WISCOM/src/components/Project/ProjectStyle.jsx +++ b/WISCOM/src/components/Project/ProjectStyle.jsx @@ -91,18 +91,24 @@ export const Text = styled.div` margin-left: 8rem; padding-left: 5rem; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + @media (max-width: 1030px) { font-size: 95%; } - @media screen and (max-width: 814px) { - margin-left: 0rem; + @media screen (min-width: 768px) and (max-width: 814px) { text-align: center; - padding-left: 0rem; + margin-left: 0rem; } @media (max-width: 768px) { font-size: 66%; + padding-left: 0rem; + margin-left: 0rem; + text-align: center; } `;