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

[HTML+CSS] Dziwnie rozciągnięty border

VMware Cloud PRO - przenieś swoją infrastrukturę IT do chmury
0 głosów
380 wizyt
pytanie zadane 26 kwietnia 2018 w HTML i CSS przez Hiskiel Pasjonat (22,830 p.)
zmienione kategorie 27 kwietnia 2018 przez Hiskiel

Witam.

 

Kolejny problem z szablonem, który chciałem kontynuować. Tutaj kod:

<html><head><style id="__web-inspector-hide-shortcut-style__" type="text/css">
.__web-inspector-hide-shortcut__, .__web-inspector-hide-shortcut__ *, .__web-inspector-hidebefore-shortcut__::before, .__web-inspector-hideafter-shortcut__::after
{
    visibility: hidden !important;
}
</style></head><body>
    <style>
        #header{
            background-color: #7dc9f2;
            width: 100%; 
            height: 30px;
            border-radius: 15px 15px 0px 0px;
            font-family: Verdana, sans-serif; 
            text-align: center;
        }
    	#header-text{
            position: relative;
            top: 3px;
    	}
        #info{
            position: relative;
            background-color: #7dc9f2;
            width: 100%; 
            height: 30px;
            border-top: 2px solid #5f5ce8;
            border-radius: 0 0 15px 15px;
            font-family: Verdana, sans-serif; 
        }
        #content{
            background-color: white;
            width: 100%;
            height: 100%;
            border: 2px solid #5f5ce8;
            border-bottom: 0;
            font-family: Verdana, sans-serif; 
            text-align: center; 
            box-sizing: border-box;
        }
    </style>
<div id="wrapper">
        <div id="header">
            <b id="header-text">T e k s t   n a g ł ó w k a</b>
        </div>   
        <div id="content">
            Siema! 
            elo<br>
            elo<br><br>
            elo<br>
            Witam
            <div id="info"></div>        </div>
</div>
</body></html>

border z #content jest rozciągnięty na całą stronę, nie wiem dlaczego.

 

Prosiłbym o pomoc.

 

Pozdrawiam.

1 odpowiedź

0 głosów
odpowiedź 26 kwietnia 2018 przez shotokan Nałogowiec (39,660 p.)
edycja 26 kwietnia 2018 przez shotokan

A czego się spodziewałeś, jeśli dałeś width: 100%. Div z #content znajduje się w divie z #wrapper, ale ten div nie jest stylizowany więc przyjmuje 100% szerokości a div z #content rozciąga się na 100% szerokości diva #wrapper.

Edit: A jeśli chodzi Ci o wysokość to dałeś height: 100% więc div rozciąga się na całą wysokość body.
A jak chcesz, aby wszystko działało tak, jak należy to należałoby zadeklarować wersję html, czyli:

<!DOCTYPE html>


P.S. Zmień kategorie.:)

komentarz 27 kwietnia 2018 przez Hiskiel Pasjonat (22,830 p.)
Dobrze, spróbuje z tym pokombinować.

A z tą kategorią mi tak z przyzwyczajenia zostało.

Podobne pytania

+1 głos
1 odpowiedź 494 wizyt
pytanie zadane 6 lipca 2022 w HTML i CSS przez AnimaVillis Stary wyjadacz (13,410 p.)
0 głosów
1 odpowiedź 330 wizyt
+4 głosów
0 odpowiedzi 565 wizyt
pytanie zadane 12 października 2021 w HTML i CSS przez VBService Ekspert (256,600 p.)

93,436 zapytań

142,431 odpowiedzi

322,669 komentarzy

62,801 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

...