Help with Problem

My home page

h1 {
text-align:center;
margin-top: 50px;
font-family: "Garamond", serif;

}

h2 {
text-align:center;
margin-top: 0px;
font-size: 15px;
font-family: "Garamond", serif;
}

.center {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: 80px;
float:middle;
}

header > h2 {
color: #2D52A0;
font-family: "Arial", sans-serif;
}

header > h2:hover {
text-decoration: underline;
}

.English {
position: relative;
bottom: 250px;
right: 120px;

}

Hi,
I edit Wikipedia regularly and I want dark mode so it is easer on my eyes. There is no skin which does this for you there are chrome extension which do it but I find them hard to use and they also slow down my computer. You can add custom css to a skin so I added this to a skin:

body {background-color: rgb(24, 24, 24);}
.cnotice {
    position: relative;
    overflow: hidden;
    background: #f8f9fa;
    border: 1px solid #a2a9b1;
    border-radius: 2px;
    margin-bottom: 1em;
    cursor: pointer;
    color: #222;
    font-weight: 500;
}

I am getting a problem with the IE6 z-index property on position: absolute. Does anyone have an idea to tack such a problem?
You can see the problem on
https://www.glorioushimalaya.com/trekking-and-hiking/everest-base-camp-trek/
when we hover the menu that goes back to the animated images. I had tried many ways but not get the problem to solve.
Expecting any idea to solve in this forum

So I have an unordered list, with list items containing hyperlink tags

<ul>
 <li> 
  <a href="#">Tag</a>
 </li>
<ul>

On my LI tag, I have a border bottom set to the background color.

When my link is hovered I want to change the color of it?

How do I change the previous elements style?

ul li a:hover{
 text-decoration: none;
 color: #Blue;
}
 
ul li a:hover li{
 border-bottom: solid 5px #Green;
}

Hello, this is my first post! Great site!

I am stuck with stretched text as a result of applying transform: scaleY(2).

I have the following html:

<div class="item-box">
    <div class="category-item">
        <h2 class="title">
            <a href="#" title="Show product">
                label
            </a>
        </h2>
        <div class="picture">
            <a href="#" title="Show product">
                <img alt="Picture for product" src="path" title="Show product">
            </a>
        </div>
    </div>
</div>

And the CSS: