여러분 안녕하세요!
.search-menu.menu-panel-results, .search-menu-container.menu-panel-results {
width: 600px;
left: 150px;
}
.floating-search-input .search-banner-inner.wrap .search-menu .search-icon {
left: 150px;
}
이 코드를 작성해서 CSS 필드에 추가하면 제가 원하는 대로 보이는데, 다른 사람들에게는 그렇게 보이지 않아요.
도와주실 수 있을까요?
https://pvpfarm.com
도움이 되는 친구들에게 인사합니다.
이걸 어떻게 가운데로 정렬할 수 있을까요?
로그인 전후로 모습이 다릅니다. 로그인한 후에는 다르게 보입니다.
항상 정확히 가운데에, 같은 위치에 유지되도록 하고 싶습니다.
감사합니다. 
추측일 뿐이지만, 오프셋은 로그인 버튼과 검색 메뉴 버튼 및 아바타의 너비 차이 때문에 발생한 것으로 보입니다.
네, 릴리, 이게 바로 문제입니다. 이 문제를 해결할 방법을 찾을 수 있을까요?
이것은 이 주제에서 겪었던 문제와 같은 건가요?
https://meta.discourse.org/t/how-can-i-center-the-search/301726?u=moin
왜 비로그인 사용자에게 검색창을 보여주는 거예요? 아, 괜찮습니다. 이제 여기 있습니다. 검색창을 클릭하면 로그인 모달이 뜨나 봤는데, 실제로는 검색을 할 수 있네요… 잠깐 둘러보고 있습니다.
맥북의 크롬에서 버그가 정말 많이 발견됩니다. 헤더 버튼이 잘못된 메뉴를 열거나, 채팅 드로어를 닫으려 하면 햄버거 메뉴가 열리거나 하는 식이에요.
그 원인에 대해서는 아직 정확한 답이 없어요. 아마 서로 충돌하는 SCSS가 있는 것 같다는 추측만 하고 있습니다. 그래도 당신과 당신의 포럼은 점점 나아지고 있어요 
- 실망하지 마세요. 처음 이곳에 왔을 때와 비교하면 당신의 사이트가 훨씬 좋아졌거든요. 경험이 없다면 CSS는 까다로운 부분이고, 조금만 부주의해도 금방 엉망이 될 수 있어요. 천천히 진행하면서 이곳의 Documentation 지식 베이스 주제들을 읽어보시길 권합니다. CSS를 좀 더 단순하고 간결하게 다듬으면 문제점을 파악할 수 있을 거라고 생각합니다.
지금 정말 놀랍습니다 
, 제 환경에서는 그런 문제가 발생하지 않습니다. 혹시 사이트 언어를 번역해서 사용 중이신 건가요? 사이트의 기본 언어는 터키어입니다.
곧 제 맥북에서 확인해 보겠습니다.
코드를 최대한 줄이고 싶지만, 구조가 매우 복잡했습니다.
관리자 권한을 드릴 수 있습니다. 얼마나 복잡한지 직접 확인해 보실 수 있습니다. 
@media screen and (min-width:640px){
.d-header .home-logo-wrapper-outlet,
.d-header .panel{
width:240px;
}
}
참고로 이 코드로 제 문제는 해결되었습니다. 하지만 외관이 보기 좋지 않습니다.
헤더 콘텐츠와 페이지 콘텐츠는 서로 독립적으로 가운데 정렬됩니다. 예를 들어, 헤더의 왼쪽 또는 오른쪽에 콘텐츠가 더 많으면 헤더의 중앙 위치가 달라집니다.
아래는 이 현상을 보여주는 예시입니다. 오른쪽 콘텐츠 양에 따라 헤더의 "중앙"이 어떻게 변하는지 확인할 수 있습니다:
헤더 콘텐츠의 폭이 변할 수 있기 때문에(번역, 버튼 수 등), 헤더와 페이지 콘텐츠의 중앙을 항상 동일하게 유지하는 간단한 방법은 없습니다.
이 코드가 작동하는 이유는 왼쪽 콘텐츠(로고)의 폭이 이제 오른쪽 콘텐츠(버튼 컨테이너)의 폭과 동일해졌기 때문입니다. 오른쪽에 표시되는 버튼이 다르므로, 로그아웃 상태(.anon)를 타겟팅하는 별도의 CSS가 필요합니다. 또한 앞서 언급했듯이 번역에 따라 버튼 크기가 달라지므로, 이는 정렬에도 영향을 미칩니다.
@awesomerobot 님, 스크린샷과 함께 설명해 주셔서 감사합니다. 제게 매우 이해하기 쉬웠습니다. 
@media screen and (min-width:640px){
.d-header .panel{
margin-left:-66px;
}
}
이 방식으로도 시도해 보고 있는데, 마치 테트리스 속 스네이크 게임처럼 두 요소가 화면에서 서로 뒤쫓아 가는感じです.
해결 방법
/* arama 검색 바 중앙 정렬 */
@media screen and (min-width:640px){
html:not(.anon) .d-header .panel {
margin-left: 95px;
}
}
.floating-search-input-wrapper {
margin-right: -35px;
}
/* arama 검색 바 중앙 정렬 */
필요에 따라 픽셀 값을 조정할 수 있습니다.