Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Dowiedz się więcej OK, rozumiem

Odstęp na górze strony

Chcesz wiedzieć jak sterować wyglądem strony za pomocą styli? Tutaj dowiesz się jakie możliwości ma CSS i jak poprawnie go stosować, aby uzyskać zamierzone efekty. Dowiesz się jakie nowości udostępniono w CSS3 i jak z nich korzystać.

Odstęp na górze strony

Post 02.02.2018, 09:40:41

Witam,
mam dość typowy problem, ale pojawia się tylko wtedy, kiedy head includuje do innego pliku. Wtedy pojawia mi się odstęp na górze strony. Szukam i szukam i nie wiem w czym może leżeć problem. Jeśli head jest w tym samym pliku to odstęp znika, więc to wina include, no ale to rodzi problem szybkiej modyfikacji.

tak jest odstęp:
Kod: Zaznacz cały
<html>
      <?php
         include 'head.php';
      ?>
   <body>

   <div class = "contener_main">
      <div class = "header">
         <div class = "text">
            <h1 class = "logo">web3promagraco</h1>
            <h2 class = "logo"></h2>
            <h2 class = "logo"></h2>
         </div>
      </div>


tak nie ma odstępu:
Kod: Zaznacz cały
<html>
      <head>
      <meta name="viewport" content="width=device-width">
      <link rel="Stylesheet" type="text/css" href="style_dyrektywy.css"/>
      <link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css?family=Lobster|Shrikhand" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css?family=Lora" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css?family=Anton|Karla|Lobster|Quattrocento|Shrikhand" rel="stylesheet">
      </head>
   <body>

   <div class = "contener_main">
      <div class = "header">
         <div class = "text">
            <h1 class = "logo">web3promagraco</h1>
            <h2 class = "logo"></h2>
            <h2 class = "logo"></h2>
         </div>
      </div>


jeszcze wykorzystywane klasy z css:
Kod: Zaznacz cały
.contener_main {
   margin-top:0;
   padding-top: 0;
   min-height:100%;
   position:relative;
}

.header {
   margin-top:0;
   padding-top: 0;
   background-repeat: no-repeat;
   background-image: url("image/web3promagraco_wystawianie_aukcji.jpg");
   background-size: cover;
   background-position: center;
   width: 100%;
   height: 300px;
}

.text {
   padding-top: 2%;
}

h1.logo {
   text-align: center;
   font-size: 5em;
   color: gold;
   line-height: 1;
}

h2.logo {
   line-height: 0;
   text-align: center;
   font-size: 30px;
   color: white;
}


Siedzę nad tym od tygodnia i wymyśliłem, że można przesunąć head niżej do body:
Kod: Zaznacz cały
<html>
   <body>

   <div class = "contener_main">
      <div class = "header">
         <div class = "text">
            <h1 class = "logo">web3promagraco</h1>
            <h2 class = "logo"></h2>
            <h2 class = "logo"></h2>
         </div>
      </div>
      <?php
         include 'head.php';
      ?>
      <div class = "contener_index_center">
         <div class = "index">

teraz odstęp (biała luka, może margines) między stroną a przeglądarką znika, to dobry sposób? Jest inny?
szachmat
Posty: 50
Dołączył(a): 02.03.2016

Re: Odstęp na górze strony

Post 02.02.2018, 10:04:41

Mam rozumieć, że w head.php masz tylko znaczniki <head>, <meta>, <link>? Może zapisujesz plik w UTF-8 razem z BOM. W takim wypadku usuń BOM z pliku.
Avatar użytkownikakuku
Rafał Kukawski

+∞
+∞

Posty: 19762
Dołączył(a): 14.04.2002

Re: Odstęp na górze strony

Post 02.04.2018, 11:21:45

usunięcie boom faktycznie pomogło, dzięki
szachmat
Posty: 50
Dołączył(a): 02.03.2016


Powrót do CSS


 


  • Podobne wątki
    Odpowiedzi
    Wyświetlone
    Ostatni post

Kto przegląda forum

Użytkownicy przeglądający ten dział: Brak zidentyfikowanych użytkowników i 1 gość

Hosting, Domeny, SSL

Subskrypcja

Mamy 51436 zarejestrowanych użytkowników.
Najnowszy użytkownik: PRODESIGNER


Nasi użytkownicy napisali:

  • 937600 wiadomości
  • w 247366 tematach

Najnowsze wpisy na blogu

Najnowsze artykuły

Najaktywniejsi (ostatnie 30 dni)