index.html w google chrome

pytanie zadane 13 lutego 2023 w HTML i CSS przez aguro_ Początkujący (270 p.)
zamknięte 15 lutego 2023 przez aguro_

Cześć,
mam dziwny problem. Zrobiłam prostą stronkę i zauważyłam, że menu wyświetla się inaczej na index.html, a inaczej na dalszych podstronach. Moje spostrzeżenia:

- problem pojawia się na chrome, na safari nie występuje.

- kiedy zmieniam nazwę z index.html na jakąkolwiek inną (np. home.html) problem nie występuje.

- pozmieniałam wszystkie wartości na sztywno (px zamiast rem czy vh) i problem nadal się pojawia.

Problem polega na tym, że na dalszych podstronach wysokość nav oraz wielkość czcionki "jakby" się zwiększa. Jakby, ponieważ dev toolsy na to nie wskazują, ale wizualnie wielkość przy zmianie podstron przeskakuje. Będę wdzięczna za wskazówki.

<!doctype html>
<html lang="pl">
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="application.css">
</head>
<body>
    <nav>
        <section class="logo-section">
            <img class="logo-white" src="assets/full_logo_white.png" alt="logo">
        </section>
        <section class="menu-section">
            <ul class="menu">
                <li><a href="./index.html">Accueil</a></li>
                <li><a href="./about.html">Qui sommes-nous?</a></li>
                <li><a href="./contact.html">Nous contacter</a></li>
            </ul>
        </section>
    </nav>
</body>
</html>

Ta część html jest identyczna dla każdej podstrony. CSS również:

body {
    margin: 0%;
    background-color: whitesmoke;
    font-family: 'Helvetica', sans-serif;
    color: dimgray;
    letter-spacing: 1px;
}

li {
    padding: 1rem;
}

a,
span {
    font-size: 12px;
    text-decoration: none;
    color: whitesmoke;
}

nav,
footer {
    background-color: slategray;
    color: whitesmoke;
}

.logo-white {
    width: 10rem;
    padding-left: 2.5rem;
    position: absolute;
    z-index: 100;
}

nav {
    padding: 1rem 0rem;
    display: flex;
    justify-content: space-between;
}

.menu-section {
    padding-right: 2.5rem;
}

.menu {
    margin: 0px;
    list-style-type: none;
    display: flex;
}

Raczej w kodzie wszystko się zgadza, oczywiście załączam część. Może brakuje jakiegoś znacznika w head html?

Edit: Może nawet nie tyle co sam pasek nawigacji, ale każdy element na podstronie. Index.html jedna wartość, przechodzę na podstronę wszystko jest jakby w niewiele większej skali...

komentarz zamknięcia: Znalazłam odpowiedź samodzielnie.

komentarz 13 lutego 2023 przez VBService Ekspert (253,420 p.)

Na wszystkich podstronach jest ten sam obrazek?

<img class="logo-white" src="assets/full_logo_white.png" alt="logo">

BTW, wystarczy taki zapis

margin: 0;  /* 0% */

padding: 1rem 0;  /* 0rem */

margin: 0;  /* 0px */

komentarz 14 lutego 2023 przez aguro_ Początkujący (270 p.)

Ok, dziękuję za uwagę. Tak, obrazek jest ten sam na każdej pod stronie.

komentarz 14 lutego 2023 przez aguro_ Początkujący (270 p.)

Sprawdziłam jeszcze przypadek w Firefox (wcześniej Safari) - błąd występuje wyłącznie w Google Chrome... Będę wdzięczna za pomoc.

Podobne pytania

Zaloguj lub zarejestruj się, aby skomentować.

Podobne pytania

O działaniu forum

Pasja informatyki w internecie

Polecane miejsca w sieci