2016-11-07 5 views
-1

Ich habe einige Anker-Links in meiner One-Page-Website, und ich habe ein Problem mit nur einer von ihnen.Anker springt zu weit

Der Abschnitt ist in einem Div, wo ich einen Titel und eine Schaltfläche habe.

Wenn ich auf den Ankerlink klicke, springt es zu weit, speziell auf den Knopf (unter dem Titel) und nicht auf den Kopf des Abschnitts (vor dem Titel).

Anchor link: (Das Problem ist mit dem vierten Link "#solution")

<div class="navbar-collapse collapse"> 
 
    <ul class="nav navbar-nav navbar-right scroll"> 
 
     <li class="active"><a href="#home">Home</a></li> 
 
     <li ><a href="#about">About</a></li> 
 
     <li ><a href="#works">Media</a></li> 
 
     <li ><a href="#solutions">Solutions</a></li> 
 
     <li ><a href="#partners">Partners</a></li> 
 
     <li ><a href="#contact">Contact</a></li> 
 
    </ul> 
 
</div>

Der Abschnitt Code:

<div id="solutions"> 
 
    <h2 class="text-center wowload fadeInUp">solutions bla bla bla</h2> 
 
    <button onclick="window.location.href='pages/solutions.html'" class="blue_button">Button</button> 
 
</div>

+0

Von einem kurzen Blick durch, das sollte funktionieren. Können Sie eine kleine Arbeitsseite bereitstellen, die das Problem reproduziert? – DBS

+0

Ich würde eine Vermutung über einige Javascript eine Aktion oder ein anderes Element hat eine ID von "Lösungen". Die HTML sieht gut aus, abgesehen von der Inline-Javascript –

+0

funktioniert die andere Links sehr gut, ich habe überprüft und keine anderen Elemente hat die gleiche ID, ich änderte sogar den ID-Namen und immer noch mit dem gleichen Problem. - Ich habe ein begrenztes Wissen mit Codierung, also vielleicht habe ich deine Antwort nicht schlecht gemacht. – Balagosh

Antwort

0

behoben durch Hinzufügen von {padding-top: 6em;} in CSS