css css inheritance

KaiAdrian · April 9, 2019

HI!

I d like to make Meni2_vsebina to be child of Meni2 (but both independent from Meni and Meni_vsebina)

as far as I change position of Meni everything change it. Here is the code:

<style>
.Meni > Meni_vsebina{
  display: inline-block;
  position:fixed;
  top:-2px; left:100px;

}
.Meni_vsebina{
  display:block;
  position:relative;

}
.Meni2 > Meni2_vsebina{
  display:block;
  position: relative;
  top:-100px; left:100px;
}
.Meni2_vsebina{
  position:absolute;
  left: 100px;
  display:inline-flex;
}
</style>
<body>
 <div class="Meni">
  <span><i>Meni</i>
  </span>
<div class="Meni_vsebina">
<a href="test1.html">Test1</a><br>
<a href="test2.html">Test2</a><br>
<a href="test3.html">Test3</a><br>
<a href="test4.html">Test4</a><br>
</div>

Edited April 9, 2019 by KaiAdrian
correction

KaiAdrian · April 9, 2019

sorry... read this code please:

<style>
.Meni {
  display: inline-block;
  position:fixed;
  top:-2px; left:100px;

}
.Meni_vsebina{
  display:block;
  position:relative;
/*here i wanna stop relashionship */
}
.Meni2{
  display:inline-block;
  position: relative;
  top:-89px; left:100px;
}
.Meni2_vsebina{
  position:absolute;
  left: 100px;
  display:none;
}

</style>



<body>
 <div class="Meni">
  <span><i>Meni</i>
  </span>
<div class="Meni_vsebina">
<a href="test1.html">Test1</a><br>
<a href="test2.html">Test2</a><br>
<a href="test3.html">Test3</a><br>
<a href="test4.html">Test4</a><br>
</div>

<div class="Meni2"
 <span>Meni2
 </span>
<div class="Meni2-vsebina">
<a href="test5.html">Test5</a><br>
<a href="test6.html">Test6</a><br>
<a href="test7.html">Test7</a><br>
<a href="test8.html">Test8</a><br>
</div>

Funce · April 9, 2019

I see the issue.

You haven't closed off all your divs in your HTML. In your HTML, you've described Meni2 as a child of Meni. The browser fills in the gaps. See "Implied </div>" in code block below.

You're going to need to place some closing div tags. Do you know where they would go?

<body>
 <div class="Meni">
  <span><i>Meni</i></span>
  <div class="Meni_vsebina">
    <a href="test1.html">Test1</a><br>
    <a href="test2.html">Test2</a><br>
    <a href="test3.html">Test3</a><br>
    <a href="test4.html">Test4</a><br>
  </div> <!-- End of Meni_vsebina -->
  <div class="Meni2">
    <span>Meni2</span>
    <div class="Meni2-vsebina">
      <a href="test5.html">Test5</a><br>
      <a href="test6.html">Test6</a><br>
      <a href="test7.html">Test7</a><br>
      <a href="test8.html">Test8</a><br>
    </div> <!--End of Meni2-vsebina-->
    <!-- Implied </div> of Meni2 -->
    <!-- Implied </div> of Meni -->

KaiAdrian · April 10, 2019

Worked...Thanx!

However, there is also an error in syntax in above code, i discovered later:

in part:

<div class=Meni2-vsebina> /*should be called Meni2_Vsebina*/

Sign In

css css inheritance

Recommended Posts

KaiAdrian

Link to comment

Share on other sites

KaiAdrian

Link to comment

Share on other sites

Funce

Link to comment

Share on other sites

KaiAdrian

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity