Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
[HTML+CSS]Scroll
#1
Mam taki układ strony:
http://img211.imageshack.us/img211/2136/kontenery.jpg

I problem jest taki, że nie pojawiają mi się scrolle. A chcę, żeby kiedy czerwony kontener wyjdzie poza krawędź po bokach strony pojawiał się scroll... Problem być może trywialny, ale ja nie potrafię sobie poradzić.

I jeszcze dwa pytania: czy da się zrobić żeby po divie nie było znaku nowej linii? Czy da się aby przed i po akapicie <'p'> nie było odstępu?
Odpowiedz
#2
dodaj w css środkowego kontenera:
overflow: auto;

scrolle pojawią się jeżeli zawartość będzie miała większe rozmiary niż kontener
Odpowiedz
#3
Oczywiste, niedziałające rozwiązania możecie darować ;]
Odpowiedz
#4
Sidneey dobrze Ci doradził więc nie wiem dlaczego się bulwersujesz. Po dodaniu overflow: auto; działa, sprawdziłem:
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style>
#ogolny {
position:fixed;
top:0;
left:0;
width:1000px;
height:1000px;
border:1px blue solid;
}

#zew {
position: relative;
width:400px;
height:700px;
margin: 0 auto;
border:1px red solid;
}

#wew {
position:relative;
width:400px;
height:500px;
border:1px black solid;
overflow:auto;
}
</style>

</head>
<body>
<div id="ogolny">
<div id="zew">
<div id="wew">Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.
Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.Tekst wychodzący poza.</div>
</div>
</div>
</body>
</html>

Co do odstępów pomiędzy akapitami, pobaw się tym:
Kod:
p {
line-height:0px;
}

A nowe linie po divie? Nie do końca wiem o co Ci chodzi, ale prawdopodobnie wystarczy zresetować css. Wpisz w google "reset css" i wklejaj sobie zawsze do plików ze stylami, wyzeruje Ci wszelkie marginesy narzucane przez przeglądarkę.
Odpowiedz
#5
Działa pod warunkiem, że ogólny ma stałą wielkość. Zerknij jak jest na moim planie ;].
Odpowiedz
#6
Zmieniłem u siebie na width:100% i height:100% i również działa.
Odpowiedz
#7
Wasze rozwiązanie nie jest do mojego problemu. Chodzi o to żeby scrolle pojawiały się po bokach strony jak kontenery zawarte w zewnętrznym poza nią wyjdą. Rozumiecie? Odpalcie sobie wasze rozwiązanie i zmniejszcie rozmiar okna przeglądarki. Jak czerwony kontener wychodzi poza strone to pojawiają się scrolle? Nie ;]. Macie na to jakiś inny pomysł? Bo to obszedłem, ale wolałbym wiedzieć. Aczkolwiek teraz zależy mi bardziej na rozwiązaniu mojego drugiego problemu:

Mam teraz inny problem:
Używam background-image do jednego z kontenerów o wymiarach X i Y, a problem jest taki, że ten obrazek z tla wyświetla się tylko pod zapełnioną częścią kontenera. Nawet jak do tego kontenera wrzucę następny o takich samych wymiarach, który powinien go zapełnić , to tak się nie dzieje...

Problem jest konkretnie taki, że nawet jak kontenerowi nadam wielkość dajmy na to 500 na 500 to jeżeli nie będzie miał zawartości to i tak będzie zajmował 0 na 0. Da się go jakoś zmusić, żeby jednak zajmował 500 na 500 a nie tyle ile mu potrzeba?

No i raz działa a raz nie. Nie rozumiem tego... Może wkleję kod:
Kod:
#okno_background{
                   position:relative;
                   width: 850px;
                   height 450px;
                   left: 5px;
                   background-image: url(oknoglowne2.png);
                   background-repeat: no-repeat;
                   padding-top: 40px;
                   padding-left: 40px;
                   padding-right: 40px;
                   padding-bottom: 40px;          
           }
...

           <div id="okno_background">
                      adsasd
           </div>

I generalnie tło mi się wyświetla tylko pod " adsasd" a nie pod całym kontenerem, a sam kontener zachowuje się tak jakby nie miał tych 450px wysokości tylko dobierał sobie tyle ile potrzebuje...

I już po problemie... Zgubiłem jeden dwukropek...
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  Kursy (x)HTML/CSS DoGeR 9 23,675 18-01-2017, 21:55
Ostatni post: Michael
Sad HTML/CSS/JQUERY - Potrzebuje pomocy / Bezradność jokerblitzz 10 10,228 28-04-2016, 00:24
Ostatni post: mubi
  [CSS]+[HTML] Pozycjonowanie slidera. Youras 2 4,751 16-01-2016, 23:11
Ostatni post: Szymon Słowik
  Kolor tła dla aktywnej podstron [CSS i HTML] bahafo 5 7,782 27-12-2014, 15:25
Ostatni post: Kartofelek
  [problem][html] cutenews i szablon kawadodek2000 1 2,988 13-08-2013, 16:49
Ostatni post: mateo

Skocz do:


Użytkownicy przeglądający ten wątek: 1 gości
Sponsorzy i przyjaciele
SeoHost.pl