Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów › Technologie internetowe - tworzenie stron WWW › Początkujący webmaster v
Nie rozciągające sie tło

Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
Tryb drzewa
Nie rozciągające sie tło
Iron22 Offline
Junior Member
**
Liczba postów: 5
Liczba wątków: 2
Dołączył: 01-04-2010
Reputacja: 0
#1
15-04-2010, 15:45
Co zrobic aby tło w tym wypadku obrazkowe(szare w którym wpisuje tekst) rozciągało się zgodnie z ilością wprowadzanego tekstu?

mój problem wygląda tak:

http://fotoo.pl/hosting-zdjec/2010-04/f ... y.bmp.html

To jest kod


>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Bez nazwy 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250" />
<!-- ImageReady Styles (Bez nazwy 1) -->
<style type="text/css">
<!--

#Tabela_01 {
position:absolute;
left:100px;
top:0px;
width:760px;
height:800px;
text-align:center


}

Img{ border:none;}
#index-01_ {
position:absolute;
left:0px;
top:0px;
width:1px;
height:246px;
}

#index-02_ {
position:absolute;
left:1px;
top:0px;
width:191px;
height:239px;
}

#index-03_ {
position:absolute;
left:192px;
top:0px;
width:568px;
height:7px;
}

#index-04_ {
position:absolute;
left:192px;
top:7px;
width:59px;
height:239px;
}

#index-05_ {
position:absolute;
left:251px;
top:7px;
width:226px;
height:223px;
}

#index-06_ {
position:absolute;
left:477px;
top:7px;
width:41px;
height:239px;
}

#index-07_ {
position:absolute;
left:518px;
top:7px;
width:212px;
height:232px;
}

#index-08_ {
position:absolute;
left:730px;
top:7px;
width:30px;
height:239px;
}

#index-09_ {
position:absolute;
left:251px;
top:230px;
width:226px;
height:16px;
}

#index-10_ {
position:absolute;
left:1px;
top:239px;
width:191px;
height:7px;
}

#index-11_ {
position:absolute;
left:518px;
top:239px;
width:212px;
height:7px;
}

#index-12_ {
position:absolute;
left:0px;
top:246px;
width:760px;
height:11px;
}

#index-13_ {
position:absolute;
left:0px;
top:257px;
width:1px;
height:105px;
}

#index-14_ {
position:absolute;
left:1px;
top:257px;
width:759px;
height:21px;
}

#index-15_ {
position:absolute;
left:1px;
top:278px;
width:21px;
height:84px;
}

#index-16_ {
position:absolute;
left:22px;
top:278px;
width:110px;
height:63px;
}

#index-17_ {
position:absolute;
left:132px;
top:278px;
width:22px;
height:84px;
}

#index-18_ {
position:absolute;
left:154px;
top:278px;
width:212px;
height:63px;
}

#index-19_ {
position:absolute;
left:366px;
top:278px;
width:15px;
height:84px;
}

#index-20_ {
position:absolute;
left:381px;
top:278px;
width:195px;
height:63px;
}

#index-21_ {
position:absolute;
left:576px;
top:278px;
width:13px;
height:84px;
}

#index-22_ {
position:absolute;
left:589px;
top:278px;
width:143px;
height:63px;
}

#index-23_ {
position:absolute;
left:732px;
top:278px;
width:28px;
height:84px;
}

#index-24_ {
position:absolute;
left:22px;
top:341px;
width:110px;
height:21px;
}

#index-25_ {
position:absolute;
left:154px;
top:341px;
width:212px;
height:21px;
}

#index-26_ {
position:absolute;
left:381px;
top:341px;
width:195px;
height:21px;
}

#index-27_ {
position:absolute;
left:589px;
top:341px;
width:143px;
height:21px;
}

#index-28_ {
position:absolute;
left:0px;
top:362px;
width:760px;
height:11px;
}

#index-29_ {
position:absolute;
left:0px;
top:373px;
width:760px;
height:427px;
}
#Tabela_01 #index-29_ {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
color: #333333;
background-image: url(Obrazki/index_29.jpg);
background-repeat:repeat
}

-->
</style>
<!-- End ImageReady Styles -->
</head>
<body style="background-color:#FFFFFF;">
<!-- ImageReady Slices (Bez nazwy 1) -->
<div id="Tabela_01">
<div id="index-01_">
<img id="index_01" src="Obrazki/index_01.jpg" width="1" height="246" alt="" />
</div>
<div id="index-02_">
<img id="index_02" src="Obrazki/index_02.jpg" width="191" height="239" alt="" />
</div>
<div id="index-03_">
<img id="index_03" src="Obrazki/index_03.jpg" width="568" height="7" alt="" />
</div>
<div id="index-04_">
<img id="index_04" src="Obrazki/index_04.jpg" width="59" height="239" alt="" />
</div>
<div id="index-05_">
<img id="index_05" src="Obrazki/index_05.jpg" width="226" height="223" alt="" />
</div>
<div id="index-06_">
<img id="index_06" src="Obrazki/index_06.jpg" width="41" height="239" alt="" />
</div>
<div id="index-07_">
<img id="index_07" src="Obrazki/index_07.jpg" width="212" height="232" alt="" />
</div>
<div id="index-08_">
<img id="index_08" src="Obrazki/index_08.jpg" width="30" height="239" alt="" />
</div>
<div id="index-09_">
<img id="index_09" src="Obrazki/index_09.jpg" width="226" height="16" alt="" />
</div>
<div id="index-10_">
<img id="index_10" src="Obrazki/index_10.jpg" width="191" height="7" alt="" />
</div>
<div id="index-11_">
<img id="index_11" src="Obrazki/index_11.jpg" width="212" height="7" alt="" />
</div>
<div id="index-12_">
<img id="index_12" src="Obrazki/index_12.jpg" width="760" height="11" alt="" />
</div>
<div id="index-13_">
<img id="index_13" src="Obrazki/index_13.jpg" width="1" height="105" alt="" />
</div>
<div id="index-14_">
<img id="index_14" src="Obrazki/index_14.jpg" width="759" height="21" alt="" />
</div>
<div id="index-15_">
<img id="index_15" src="Obrazki/index_15.jpg" width="21" height="84" alt="" />
</div>
<div id="index-16_">
<a href="o nas.html"target="_blank" rel="nofollow"><img id="index_16" src="Obrazki/index_16.jpg" width="110" height="63" alt="" /></a>
</div>
<div id="index-17_">
<img id="index_17" src="Obrazki/index_17.jpg" width="22" height="84" alt="" />
</div>
<div id="index-18_"> <a href="http://www.allegro.pl/show_user_auctions.php?uid=9581771" target="_blank" rel="nofollow">
<img id="index_18" src="Obrazki/index_18.jpg" width="212" height="63" alt="" /></a>
</div>
<div id="index-19_">
<img id="index_19" src="Obrazki/index_19.jpg" width="15" height="84" alt="" />
</div>
<div id="index-20_"> <a href="http://www.allegro.pl/show_user.php?uid=9581771" target="_blank" rel="nofollow">
<img id="index_20" src="Obrazki/index_20.jpg" width="195" height="63" alt="" /></a>
</div>
<div id="index-21_">
<img id="index_21" src="Obrazki/index_21.jpg" width="13" height="84" alt="" />
</div>
<div id="index-22_">
<img id="index_22" src="Obrazki/index_22.jpg" width="143" height="63" alt="" />
</div>
<div id="index-23_">
<img id="index_23" src="Obrazki/index_23.jpg" width="28" height="84" alt="" />
</div>
<div id="index-24_">
<img id="index_24" src="Obrazki/index_24.jpg" width="110" height="21" alt="" />
</div>
<div id="index-25_">
<img id="index_25" src="Obrazki/index_25.jpg" width="212" height="21" alt="" />
</div>
<div id="index-26_">
<img id="index_26" src="Obrazki/index_26.jpg" width="195" height="21" alt="" />
</div>
<div id="index-27_">
<img id="index_27" src="Obrazki/index_27.jpg" width="143" height="21" alt="" />
</div>
<div id="index-28_">
<img id="index_28" src="Obrazki/index_28.jpg" width="760" height="11" alt="" />
</div>
<div id="index-29_">
<p><br />Doskonale zdajemy sobie sprawę


<img id="index_29" src="Obrazki/index_29.jpg" width="760" height="427" alt="" /> </div>
</div>
<!-- End ImageReady Slices -->
</body>
</html>
Szukaj
Odpowiedz
Dhofca Offline
Moderator
*****
Liczba postów: 296
Liczba wątków: 1
Dołączył: 11-12-2009
Reputacja: 9
#2
15-04-2010, 16:55
Po pierwsze link ucięty, po drugie kod wstawiaj z użyciem bbcode.
Szukaj
Odpowiedz
Kartofelek Offline
Super Hero
******
Liczba postów: 2,411
Liczba wątków: 14
Dołączył: 10-08-2009
Reputacja: 132
#3
15-04-2010, 22:26
Szkoda ze na polskich forach tak czesto ludzie nie potrafia nawet zadac pytania. Ozcywiście każdy specjalista wiec który to div jest tym szarym, o co w ogóle chodzi autorowi itp.
Zasadniczo powinieneś użyć background-repeat:repeat-y; ale to wszystko zalezy od tego jak pociales dany layout. Patrzac na kod jest on opciety bardzo zle, wiec nie mam pewnosci ze bedziesz w stanie uzyc tego stylowania.
Nastepnym razem gdy zadajesz pytanie daj linka do strony, bo z takiego kodu, ktory opiera sie w zasadzie na obrazkach tylko magik bedzie potrafil wyciagnac sedno Smile
Strona WWW Szukaj
Odpowiedz
Iron22 Offline
Junior Member
**
Liczba postów: 5
Liczba wątków: 2
Dołączył: 01-04-2010
Reputacja: 0
#4
16-04-2010, 00:24
To jest ten fragment kodu:

#index-29_ {
position:absolute;
left:0px;
top:373px;
width:760px;
height:427px;
}
#Tabela_01 #index-29_ {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
color: #333333;
background-image: url(Obrazki/index_29.jpg);
background-repeat:repeat
}

I oto chodzi żebym mógł wprowadzac nieograniczona ilośc tekstu żeby to tło się nie przesuwało w dół jak na obrazku że tekst jest nieruchomy a tło sie przesuwaSad
Szukaj
Odpowiedz
Iron22 Offline
Junior Member
**
Liczba postów: 5
Liczba wątków: 2
Dołączył: 01-04-2010
Reputacja: 0
#5
16-04-2010, 06:08
(16-04-2010, 00:24)Iron22 napisał(a): To jest ten fragment kodu:

#index-29_ {
position:absolute;
left:0px;
top:373px;
width:760px;
height:427px;
}
#Tabela_01 #index-29_ {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
color: #333333;
background-image: url(Obrazki/index_29.jpg);
background-repeat:repeat
}

I oto chodzi żebym mógł wprowadzac nieograniczona ilośc tekstu żeby to tło się nie przesuwało w dół jak na obrazku że tekst jest nieruchomy a tło sie przesuwaSad

Nawet zmieniłem dzisiaj to
#index-29_ {
position:absolute;
left:0px;
top:373px;
width:760px;
height:427px;

na takie wartości

#index-29_ {
position:absolute;
left:0px;
top:373px;
width:100%;
height:100%;

Pomogło na chwilę bo po wprowadzeniu większej ilości tektu tło znowu rodzielało się jak na obrazuku. CO ciekawe ten efekt mam tylko W Firefoxie i Operze w Internet Expolrer już nie.
Szukaj
Odpowiedz
Haden Offline
Member
***
Liczba postów: 112
Liczba wątków: 20
Dołączył: 07-02-2010
Reputacja: 0
#6
18-04-2010, 02:25
Daj długość zamiast 100% na auto czyli,

height: auto;

Jak Ty się łapiesz dając wszędzie index-nr to niewiem no ale szczegół. Smile
Strona WWW Szukaj
Odpowiedz
Pedro84 Offline
Przyjaciel Forum
****
Liczba postów: 2,587
Liczba wątków: 2
Dołączył: 03-04-2010
Reputacja: 58
#7
18-04-2010, 03:03
Wszystko pozycjonowane absolutnie? Ups... Poczytaj jakiś kurs, html + css...
Szukaj
Odpowiedz
Haden Offline
Member
***
Liczba postów: 112
Liczba wątków: 20
Dołączył: 07-02-2010
Reputacja: 0
#8
18-04-2010, 03:10
position:absolute;

no tego nie zauważyłem bo nie przeglądałem cssa Big Grin
Strona WWW Szukaj
Odpowiedz


Skocz do:


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