Nagłówek o szerokości 100% nie wypełnia przeglądarki

Gdy okno przeglądarki jest wystarczająco małe, aby wymusić poziomy pasek przewijania, a następnie przewija się w prawo kolor tła nagłówka, który kończy się przed krawędzią przeglądarki. Używam klasy css.Nagłówek o szerokości 100% nie wypełnia przeglądarki

.s_header { 
    margin: 0; 
    width: 100%; 
    display: block; 
    border-bottom: 1px solid #000; 
    background-color:#b8dbec; 
    height:133px; 
}

Zawartość <div class="s_header"> nie są tak szerokie, jak w tabeli 4 w której to kolumnie sumy zawartości Abot 840px z obrazu szerokościach + dopełnienia i stałą szerokość 140px kolumny. Więc gdy okno przeglądarki ma mniej niż 840 pikseli, znajduje się poziomy pasek przewijania, który jest ok, z wyjątkiem tego, że tło nagłówka jest obcięte podczas przewijania.

Elementami macierzystymi <div class="s_header"> są treść i html, dla których szerokość 100% oznacza szerokość okna. Próbowałem w tym zawinięcie: widoczne w klasie .s_header bez powodzenia.

Szerokość ciało jest również ustawiony na 100% marży 0

Czy istnieje prosty sposób, że mogę dostać tło rozszerzyć na prawo, gdy pojawi się pasek przewijania?

Strona Problem polega na here

Wszelkie sugestie będą bardzo mile widziane.

Źródło

2009-07-22 Anonymous

całego serca sugerują, że używasz Firefoksa i zainstalować Firebug http://getfirebug.com/

Ma to fajna funkcja, która pozwala kontrolować elementu DOM, i powie to wszystkie style i co stylów pochodzą one z. Więc jeśli ciało jest dziedziczenie jakiś niesforny dopełnienie (lub coś), będzie można zobaczyć wizualnie, co się dzieje :-)

Źródło

2009-07-22 17:51:14

nie udzielić odpowiedzi do pytania. Aby skrytykować lub poprosić o wyjaśnienie od autora, pozostaw komentarz pod swoim postem. – kolossus

Dziękuję za opinię na temat prawie sześcioletniej odpowiedzi ... zanim krytyka/wyjaśnienie było dobrze ugruntowaną praktyką społeczną;) –

Nie ma za co; Jako zaufany użytkownik ufam, że rozumiesz, jak do tego doszło. Kolejka przeglądania go obsługuje i pracujemy nad nim – kolossus

ustawić marginesy tagu ciała

Sposób

in-line

<body style="margin: 0px 0px 0px 0px;">

W swojej style.css (lub cokolwiek)

body { 
    margin: 0px 0px 0px 0px; 
}

Źródło

2009-07-22 17:52:35

Krótki tryb +1 i dopełnienie: body {margin: 0; padding: 0} – gmunkhbaatarmn

Mam body {margin: 0; padding: 0}, ale to nie pomogło. Nagłówek jest znacznie mniejszy niż treść ... – DashaLuna

łatwiejszy sposób jest stworzenie wewnętrznej div i ustawić ją na tej samej szerokości jak strona idzie tuż przed pojawieniem się pasek przewijania przykład

<div class="s_header"> <div class="inner"> 

</div> </div> 

.inner{ 
    width:990px; 
    background:#f00; 
    margin:0 auto; 
}

Źródło

2009-07-23 10:50:26

Prawie nigdy nie jest dobrym pomysłem ustawienie szerokości elementu div na zakodowany numer. –

Wygląda na to, że problem dotyczy trzech obrazów w tabeli głównej. Kiedy zmniejszasz szerokość przeglądarki, powoduje to, że trzy obrazy są w wiązce, będąc w poszczególnych komórkach tabeli, których nie można zawijać, co daje stałą szerokość.

Możesz spróbować kusić rozwiązanie, używając powtarzającego się tła dla nagłówka, ale chciałbym ponownie zapisać strukturę tabeli z podejściem swobodnym.

Źródło

2009-07-23 10:59:34

My [bardzo prosty] [i prawdopodobnie brzydki] Rozwiązanie:

ustawić znacznik ciała minimum szerokości własności do 100%;
zdefiniować MinWidth klasę określającą właściwość width: 100% i min-width własności na podstawie następującego obliczenia:
- po ustawić rozmiar czcionki do 100%, sprawdzić jego tłumaczenie na piksele w przeglądarce;
- dzielą teraz 17" monitoruje standardowej rozdzielczości 1440px szerokość tej pikseli 1em wyniku rozmiar czcionki,
- ustawieniu minimalnej szerokości własności wyrażoną EM do tego celu;
- np czcionki-family: ' Gill Sans MT”bezszeryfową; 100% wyniki rozmiar czcionki w 16px;
  1440/16 = 90
  Twój CSS musi wyglądać następująco:
  html {whatever} body {min-width: 100%;} .minwidth {min-width:90em;width:100%;}

Wreszcie 3. zastosuj klasę .minwidth do wszystkich starszych dzieci starszych, które mają 100% szerokości ciała.

rezise okna przeglądarki i/lub zmienić rozdzielczość, powinieneś pozbyć się ten przykry problem dla wszystkich rozdzielczościach aż do 1440 * 900

Nadziei mogłem pomóc

Źródło

2012-03-28 16:14:32

Nagłówek o szerokości 100% nie wypełnia przeglądarki

Odpowiedz

Powiązane problemy