Text folgt div

Hallo ich bin wieder ich habe ein Problem ... Sie sehen, ich habe ein div in einem anderen div und das div hat Text drin .. Allerdings, wenn ich mein zweites div nach rechts in meinem großen div positionieren Text wird auch richtig positioniert ... Und ich bin nicht in der Lage, es zurück zu bewegen mit left:0 es funktioniert mit left:-250px aber das nicht eine gute Lösung .... wie soll ich das erreichen?Text folgt div

#spellista { 
 
    background-color: green; 
 
    position: absolute; 
 
    right: 0; 
 
    width: 29%; 
 
    height: 100%; 
 
    top: 0; 
 
} 
 

 
#first { 
 
    left: 0 !important; 
 
    position: absolute; 
 
} 
 

 
.second { 
 
    color: red; 
 
} 
 

 
.third { 
 
    color: blue; 
 
} 
 

 
#searchBar { 
 
    height: 80%; 
 
    width: 85%; 
 
    background-color: rgba(32, 32, 45, 0.98); 
 
    position: fixed; 
 
    top: 10%; 
 
    left: 0; 
 
    z-index: 2; 
 
    margin: auto; 
 
    top: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    border-radius: 5px; 
 
    z-index: 3; 
 
}

<div id="searchBar"> 
 
    <div id="spellista"> 
 
    <ul id='first'> 
 
     <li class="second">MOre TEXT</li> 
 
     <li class="third">TEXT</li> 
 
    </ul> 
 
    </div> 
 
</div>

Quelle

2017-05-04 Stupid Jack

Sie haben mehrere Elemente mit derselben ID, die nicht korrekt ist. Id muss eindeutig sein –

entfernen Sie doppelte Ids

#spellista { 
 
    background-color: green; 
 
    position: absolute; 
 
    right: 0; 
 
    width: 29%; 
 
    height: 100%; 
 
    top: 0; 
 
} 
 

 
#first { 
 
    left: 0 !important; 
 
    position: absolute; 
 
} 
 

 
.second { 
 
    color: red; 
 
} 
 

 
.third { 
 
    color: blue; 
 
} 
 

 
#searchBar { 
 
    height: 80%; 
 
    width: 85%; 
 
    background-color: rgba(32, 32, 45, 0.98); 
 
    position: fixed; 
 
    top: 10%; 
 
    left: 0; 
 
    z-index: 2; 
 
    margin: auto; 
 
    top: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    border-radius: 5px; 
 
    z-index: 3; 
 
}

<div id="searchBar"> 
 
    <div id="spellista"> 
 
    <div id="spellista1"> 
 
     <ul id='first'> 
 
     <li class="second">MOre TEXT</li> 
 
     <li class="third">TEXT</li> 
 
     </ul> 
 
    </div 
 
    </div> 
 
</div>

Quelle

2017-05-04 13:24:13

Aber dann ist die grüne Box auf der falschen Seite –

lassen Sie mich ein paar Dinge dann ändern, warte eine Sekunde –

ah vergiss es war die gleiche ID-Sache, die Dinge versaut –

Ihr CSS-Code ist Ok, nur HTML-Code ändern (mehrere Elemente mit gleichen ID haben):

Ihr Code:

<div id="searchBar"> 
    <div id="spellista"> 
    <div id="spellista"> 
     <ul id='first'> 
     <li class="second">MOre TEXT</li> 
     <li class="third">TEXT</li> 
     </ul> 
    </div 
    </div> 
</div>

ändern:

<div id="searchBar"> 
    <div id="spellista"> 

     <ul id='first'> 
     <li class="second">MOre TEXT</li> 
     <li class="third">TEXT</li> 
     </ul> 

    </div> 
</div>

Voll Code:

#spellista{ 
 
    background-color: green; 
 
    position: absolute; 
 
    right: 0; 
 
    width: 29%; 
 
    height: 100%; 
 
    top: 0; 
 
} 
 
#first{ 
 
left:0 !important; 
 
position:absolute; 
 
} 
 
.second{ 
 
color:red; 
 
} 
 
.third{ 
 
color:blue; 
 
} 
 
#searchBar{ 
 
height:80%; 
 
width:85%; 
 
background-color:rgba(32, 32, 45, 0.98); 
 
position:fixed; 
 
top: 10%; 
 
left: 0; 
 
z-index:2; 
 
margin: auto; 
 
top: 0; 
 
right: 0; 
 
bottom: 0; 
 
border-radius:5px; 
 
z-index:3; 
 
}

<div id ="searchBar"> 
 
<div id = "spellista"> 
 
    
 
      <ul id = 'first'> 
 
      <li class = "second">MOre TEXT</li> 
 
      <li class = "third">TEXT</li> 
 
      </ul> 
 
    </div> 
 
     
 
    
 
    </div>

Quelle

2017-05-04 13:29:16 Ehsan

Text folgt div

Antwort

Verwandte Themen