Żeby zobrazować temat (IMG:
style_emoticons/default/wink.gif) Mam taki oto układ strony:
(IMG:
http://img259.imageshack.us/img259/2107/strik.png)
Czarne to tło które chce rozciągnąć (IMG:
style_emoticons/default/wink.gif) Czerwone stopka, na białe to tło zdefiniowane jako BODY w css. Więc czarne jest NA nim (IMG:
style_emoticons/default/wink.gif) Teraz kiedy na białym wpiszę tekst, to jak zmusić czarne tło do rozciągnięcia się?
Bałe to wstazka (IMG:
style_emoticons/default/smile.gif) obrazek tła czarnego to page_bg. kiedy wrzucam tam
tło się zrozciąga. Jak to zrobic by działo się to automatycznie?
CSS:
body {
background-image:url(../images/bg.jpg);
background-color: #000;
margin: 0px;
}
a.thickbox:link, a.thickbox:visited {
color: #fff;
text-decoration: none;
}
a.thickbox:hover {
color: #fff;
text-decoration: underline;
}
a.white:link, a.white:visited {
color: #fff;
text-decoration: none;
}
a.white:hover {
color: #fff;
text-decoration: underline;
}
div {
font-family: tahoma;
font-size: 12px;
color: #fff;
}
.zloty {
color: #f4d061;
}
.zielony {
color: #aee000;
}
.czerwony {
color: #ff2d2d;
font-size: 18px;
font-weight: bold;
text-align: center;
}
.niebieski {
color: #00a0d5;
}
#przerwa {
padding-left: 30px;
}
#przerwa2 {
padding-left: 30px;
}
#logo {
background-image: url(../images/logo.jpg);
width: 501px;
height: 153px;
display: block;
padding: 15px;
}
#menu_dzisiaj {
background-image: url(../images/menu_dzisiaj.jpg);
padding-left: 40px;
width: 491px;
height: 214px;
}
#page_bg {
background-image: url(../images/page_bg.jpg);
background-repeat: repeat-y;
width: 531px;
float: left;
}
ol
{
list-style-type: 1;
padding-left: 15px;
}
ol li span {
float: left;
width: 400px;
}
ol li span.span2 {
float: left;
width: 365px;
}
#wstazka {
padding-top: 80px;
padding-left: 25px;
}
#menu {
float: left;
clear: both;
}
#menu_reszta {
background-image:url(../images/menu.png);
width: 164px;
height: 46px;
position: absolute;
clear: both;
}
p {
height: 0px;
line-height: 0px;
}
#terminarz {
background: rgba(0, 0, 0, 0.6);
border-color: #f4d061;
border:1px dashed;
padding-left: 10px;
padding-top: 10px;
}
#top_bg {
padding-top: 15px;
text-align: center;
}
#stopka {
background-image:url(../images/stopka.jpg);
width: 461px;
height: 66px;
padding-left: 70px;
padding-top: 27px;
}
.tekst {
background-image:url(../images/tekst.png);
width: 120px;
height: 17px;
padding-left: 3px;
padding-right: 3px;
font-family: tahoma;
font-size: 9px;
color: #fff;
border: 0px;
}
.zapisz {
background-image:url(../images/zapisz.jpg);
width: 60px;
height: 19px;
padding-left: 3px;
padding-right: 3px;
padding-bottom: 2px;
font-family: tahoma;
font-size: 9px;
color: #fff;
border: 0px;
}
.g-plusone {
color: #fff;
}
#backtotop {
position: fixed;
right: 0px;
bottom: 0px;
}
DIVy:
<div style="float: left;"> <div id="menu_dzisiaj" style="text-shadow: #000 1px 1px 1px;"> <div style="padding-left: 10px;"> <?php
while ($promo = mysql_fetch_row($wynikp))
{
echo "$promo[0]";
}
?>
Tekst Stopki
<?php
while ($danied = mysql_fetch_row($wynikd))
{
echo "$danied[0]";
}
?>
Ten post edytował blejdas 9.04.2012, 09:55:25