2014-10-06 2 views
0

나는 음수 여백을 갖는 것처럼 배경을 수행하는 방법을 결정하려고 노력해 왔습니다. 여기에 내가HTML 배경 위치 지정

http://imgur.com/rYqDn5l

현재로서는 한 일의 사진은 내가 그 결과

음의 여백을 사용하려고 http://imgur.com/E5MMUSt

임하지만 행운으로 원하는 쇼 아래 그림 조금도. 여기 내 코드는 내 CSS 답글 정말 감사합니다

#main{ 
    background: #bf35bc; 
    background-position: top; 

} 

지금

HTML

<div class="container"> 
        <div class="navbar navbar-custom radius-fixer nomargin" role="navigation"> 
           <div class="navbar-header"> 
           <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
            <span class="sr-only">Toggle navigation</span> 
            <span class="icon-bar"></span> 
            <span class="icon-bar"></span> 
            <span class="icon-bar"></span> 
           </button> 
           </div> 
           <div class="navbar-collapse collapse nopaddingright"> 
           <ul class="nav navbar-nav">  
            <li class="active"><a href="<?php echo home_url(); ?>">HOME</a></li>   
            <li><a href="about-us">ABOUT US</a></li> 
            <li><a href="faq">FAQ</a></li> 
            <li><a href="contact-us">CONTACT US</a></li> 
            <li><a href="online-forms">ONLINE FORMS</a></li> 
            <li><a href="virtual-clinic-tour">VIRTUAL CLINIC TOUR</a></li>  
            <li><a href="blog" class="noborder">BLOG</a></li>    
           </ul>      
           </div><!--/.nav-collapse --> 
          </div><!--/.container-fluid --> 
</div> 

<div class="clearfix" id="main"> 
    <div class="container"> 
    <div class="flexslider nomargin"> 
         <ul class="slides"> 
         <li> 
          <img src="SLIDER1" /> 
          </li> 
          <li> 
          <img src="SLIDER2" /> 
          </li> 
          <li> 
          <img src="SLIDER3" /> 
          </li> 
         </ul>  
    </div> 
    </div> 
</div> 

의로이다.

+2

시도 -가 겹치는 것 때문에 탐색 모음 또는 여백 탑 (+)를() 배경. 편집 : jsfiddle에 코드를 넣어서 볼 수 있습니다. – nCore

+0

@nCore 부정적인 여백을 두는 것은 여기에서 작동하지 않습니다 http://imgur.com/RXhZLWw navbar가 사라집니다 – PHwpGUY

+0

@ web-tiki 저는 부트 스트랩을 사용하고 있습니다. – PHwpGUY

답변

1

당신은 main 요소에 부정적인 위쪽 여백을 적용하여 당신이 원하는 것을 달성 할 수 있어야한다 : 사업부를 위로 끌어

margin-top: -40px; 

. http://www.bootply.com/5n8DsKXPQG 필요한 것을 할 나타납니다 : 나는 질문에서 Bootply 예를 포크, 그리고 음의 위쪽 여백을 추가 한

http://jsfiddle.net/raad/f6r1Lvf9/embedded/result/

편집을 참조하십시오.

+0

나는 그것을 시도했지만 나는 당신과 같은 결과를 얻지 못한다. – PHwpGUY

+0

여기에 http://imgur.com/RXhZLWw 사라집니다. – PHwpGUY

+0

@PHwpGUY - 답변을 업데이트했습니다. – Raad

0

이 부정적인 위쪽 여백입니다 : margin-top: -50px;

그래서 당신이 마진 - 하단 퍼팅 시도 할 수 있습니다

#main{ 
    background: #bf35bc; 
    background-position: top; 
    margin-top: -50px; 
}