• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed index.html w google chrome

Aruba Cloud - Virtual Private Server VPS
0 głosów
207 wizyt
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 (256,600 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

0 głosów
1 odpowiedź 1,235 wizyt
pytanie zadane 14 marca 2019 w HTML i CSS przez stigman93 Początkujący (300 p.)
0 głosów
0 odpowiedzi 615 wizyt
pytanie zadane 14 lipca 2020 w Hostingi, domeny, usługi przez Sebix71 Początkujący (260 p.)
0 głosów
2 odpowiedzi 612 wizyt
pytanie zadane 4 maja 2016 w Bezpieczeństwo, hacking przez niezalogowany

93,327 zapytań

142,323 odpowiedzi

322,397 komentarzy

62,658 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...