Div flex con ancora non funziona

**lucavalentino** · 11-01-2022, 21:34

Sto creando tramite flexbox una pagina con due div.
Nel div di sinistra ci sono tutti i link ancora che riportano ad un punto preciso del div di sinistra.

Per non rendere troppo lungo il div ho aggiunto al div contenuto height e overvflow scroll.

**KillerWorm** · 12-01-2022, 02:38

[MOD]
Non sei nuovo del forum per cui mi permetto di domandarti in modo un po' sarcastico: "quale sarebbe la richiesta?"

Ciò che hai scritto mi sembra solo un riepilogo di quel che hai fatto ma non chiarisce nulla né sul problema né sull'obbiettivo che vorresti ottenere.

Inoltre, occhio ai titoli:

Div flex con ancora non funziona

Vedi regolamento di sezione riguardo l'evitare termini inutili nei titoli dei thread.

Puoi capire da te che "non funziona" non aggiunge nulla alla descrizione del problema e né tanto meno può esprimere una richiesta implicita d'aiuto.

Ti invito quindi, proseguendo questa discussione, a riformulare meglio la descrizione del problema fornendo tutti i dettagli del caso e specificando esattamente di quale aiuto necessiti; così sarà più facile ricevere il giusto aiuto.

Per "tutti i dettagli del caso" vedi regolamento di sezione riguardo "Contenuti dei thread".
Evitiamo di portare avanti discussioni "a spizzichi e bocconi".

Grazie per l'attenzione e buon proseguimento

**lucavalentino** · 12-01-2022, 21:45

Jquery mi blocca i link ancora

codice HTML:

<!doctype html><html><head><meta charset="utf-8">    
<meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Titolo</title>        <!--
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>--> 
       <link href="https://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.min.css" rel="stylesheet">    
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap" rel="stylesheet">    <link href="https://cdn.jsdelivr.net/npm/foundation-sites@6.7.4/dist/css/foundation.min.css" rel="stylesheet" type="text/css">    <script src="https://cdn.jsdelivr.net/npm/foundation-sites@6.7.4/dist/js/foundation.min.js" crossorigin="anonymous"></script>        
<script>$(function() {$(document).foundation();});</script><script src="../js/animated-scroll.js"></script>            </head><body> 
   <div class="grid-x">    <div class="cell small-3">         
<ol class="list-upper-roman" data-smooth-scroll>   <li><a href="#I">SEZIONE I<br/></a></li>   <li><a href="#II">SEZIONE II</a></li>   </ol>              
<p><a href="#II-1">SEZIONE II-1</a></p>              
<ol class="list-upper-roman" start="3">               <li><a href="#III">SEZIONE III </a></li>                <li><a href="#IV">SEZIONE IV</a></li>              </ol>        </div>    
<div class="cell small-12 medium-9 overflow-x-hidden overflow-y-scroll" style="height: 20px; overflow-y: scroll;">        <a id="I"></a><p>contenuto I</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p>        <a id="II"></a><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p>        
<a id="II-1"></a><p>contenuto II-1</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p>       
 <a id="III"></a><p>contenuto III</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p>        
<a id="IV"></a><p>contenuto IV</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto II</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p><p>contenuto</p>        </div>        </div></body></html>

Discussione: Div flex con ancora non funziona

Strumenti discussione

Ricerca discussione

Visualizza

Div flex con ancora non funziona

Permessi di invio