2013-04-26 5 views
0

h2와 메뉴가있는 헤더가 있습니다. 메뉴는 모든 해상도에서 항상 오른쪽에 있어야합니다. 그러나 해상도를 변경하기 위해 창 크기를 조정할 때 메뉴는 H2를 바로 통과합니다. 어떤 생각이이 문제를 해결하는 방법입니까? 나는 3 일 이상 이것을 지금보고 있었다.브라우저 크기를 조정할 때 메뉴가 H2로 바뀜

많은 도움을 주셨습니다. http://nickdaelemans.be/wordpress/

브라우저의 크기를 조정 시도하고 참조 :

#headermenu .menu-primary-menu-container { 
width: 749px; 
float: right; 
right: 3%; 
position: relative; 
bottom: 50px; 

실제 생활에서 그것을 볼이 내 메뉴에서 CSS가

http://jsfiddle.net/JHJcQ/

입니다 : 여기

는 일부 코드입니다 무슨 일이 일어나는가

죄송 합니다만,이 모든게 아주 새롭습니다! 감사합니다

+2

음, 코드가 도움이 될 것입니다. –

+0

안녕하세요. 제발 (http://jsfiddle.net에서 피들)에 코드를 게시 하시겠습니까? 이 슈퍼가 향후에 질문 할 때 유용 할 수도 있습니다. http://stackoverflow.com/faq#howtoask :) – LeonardChallis

답변

0

업데이트] 해결 방법 :

당신의 CSS를 스크립트에서 헤더 min-width 태그를 추가합니다.

일반적으로 이러한 유형의 문제를 피하기 위해 전체 페이지가 div 컨테이너로 나뉩니다. 그의 모든 페이지 컨텐츠를 큰 컨테이너에 넣고 여백, 패딩, 위치 및 경우에 따라 최소 너비와 같은 특정 속성을 지정해야합니다. 주어진 CSS를 추가하십시오.

죄송합니다. 여기에 코드가 있습니다.

에서 찾아보십시오 http://fiddle.jshell.net/qpqZs/ 그리고 CSS에서 태그를 깔끔하게 사용하십시오. 사용하지 않은 클래스를 추가로 제거하십시오.

<div id="container"> 

<div id="headermenu"> 
    <h2 >FASHIONFABRICE</h2> 
    <div class="menu-primary-menu-container"> 
     <ul id="menu-primary-menu" class="primary"> 
      <li id="menu-item-101" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-101"><a href="http://nickdaelemans.be/wordpress/">About</a> 
      </li> 
      <li id="menu-item-100" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-8 current_page_item current_page_parent menu-item-100"><a href="http://nickdaelemans.be/wordpress/?page_id=8">Blog</a> 
      </li> 
      <li id="menu-item-99" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-99"><a href="http://nickdaelemans.be/wordpress/?page_id=9">Styling</a> 
      </li> 
      <li id="menu-item-98" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-98"><a href="http://nickdaelemans.be/wordpress/?page_id=10">Contact</a> 
      </li> 
      <li id="menu-item-97" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-97"><a href="http://nickdaelemans.be/wordpress/?page_id=11">Follow Us</a> 
      </li> 
      <li id="menu-item-96" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-96"><a href="http://nickdaelemans.be/wordpress/?page_id=12">Press</a> 
      </li> 
     </ul> 
    </div> 
</div> 
<div id="logo"> 
    <img src="http://nickdaelemans.be/wordpress/wp-content/themes/follow-me-darling-child/img/FashionFabrice Logo.png" /> 
</div> 
</div> 
+0

나를 위해 작동하지 않았습니다. –

+0

div 태그에 전체 내용을 삽입 해 보았습니까? 이 최소 폭을 해당 컨테이너에 적용합니다. 나는 당신의 코드 포맷을 모른다. body 태그에이 최소 너비를 사용해보십시오. 나는 같은 문제를 겪고 있었다. 그것을 해결했습니다. 시험 번호 – unkn0wn

+0

http://jsfiddle.net/JHJcQ/1/이 작동하는지 확인하려면 testnzip.comli.com을 참조하십시오. – unkn0wn

관련 문제