Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> wrapper div
!Ci
post 6.01.2008, 02:24:37
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 6.01.2008

Ostrzeżenie: (0%)
-----


Tworze sobie obramowanie na rozne elementy za pomoca div. Stworzylem okno z 3 contenerami Header, Content, Footer. Do kazdego z nich dodalem po 3 div (top-left, top-middle, top-right,....). Otaczajace elementy zawieraja grafiki obramowania i kiedy dodam do elementu centralnego jakis obiekt, chcialbym zeby z rozszezeniem sie div'a poszerzyly sie rowniez grafiki(odpowiadajace za krawedzie). Jezeli wpisze rozmiary recznie wszystko jest ok, ale nie da sie tego automatycznie zrobic (taki automatyczny padding).

pozdrawiam
Go to the top of the page
+Quote Post
devnul
post 6.01.2008, 02:27:11
Post #2





Grupa: Zarejestrowani
Postów: 1 470
Pomógł: 75
Dołączył: 21.09.2005
Skąd: że znowu

Ostrzeżenie: (0%)
-----


nie wiem czy dobrze rozumiem ale spróbuj użyć wartości wyrażonych w procentrach


--------------------
Profesjonaliści są przewidywalni...
strzeż się amatorów...
FL4SHB4CK - imprezy, galerie, lokale
Go to the top of the page
+Quote Post
!Ci
post 6.01.2008, 03:16:20
Post #3





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 6.01.2008

Ostrzeżenie: (0%)
-----


W takim przypadku div rozszeza mi sie do wielkosci kontenera.

Ten post edytował !Ci 6.01.2008, 03:16:32
Go to the top of the page
+Quote Post
Sebastian003
post 6.01.2008, 10:53:20
Post #4





Grupa: Zarejestrowani
Postów: 282
Pomógł: 2
Dołączył: 22.03.2007

Ostrzeżenie: (0%)
-----


Podaj jakiś kod albo stronkę będzie łatwiej.
Go to the top of the page
+Quote Post
!Ci
post 6.01.2008, 15:51:13
Post #5





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 6.01.2008

Ostrzeżenie: (0%)
-----


Kod
<div style="width: 220px;">
             <div>
                 <div id="top-left-win">
                 </div>
                 <div id="top-middle-win">
                 </div>
                 <div id="top-right-win">
                 </div>
             </div>
             <div id="middle">
                 <div id="left-win">
                 </div>
                 <div id="middle-win">
                        <b>WSTAWIANY OBIEKT</b>
                 </div>
                 <div id="right-win">
                 </div>
             </div>
             <div id="bottom">
                 <div id="bottom-left-win">
                 </div>
                 <div id="bottom-middle-win">
                 </div>
                 <div id="bottom-right-win">
                 </div>
             </div>
            
         </div>


Style wygladaja tak:
Kod
#header,#top-left-win,#top-middle-win,#top-right-win {
     height: 28px;
}

#bottom-left-win,#bottom-middle-win,#bottom-right-win{
     height: 15px;
}

#middle
{
     clear: left;
}  

#bottom{
     clear: left;
}

#top-left-win{
     width: 9px;
     background: url(okno/top-left-blue.png) no-repeat;
     float: left;
}

#top-middle-win{
     /*padding-right: 20px;*/
     background: url(okno/top-middle-blue.png);
     float: left;
}

#top-right-win{
     width: 15px;
     background: url(okno/top-right-blue.png);  
     float: right;
}

#left-win
{
     width: 9px;
     background: url(okno/left-blue.png);  
     float: left;
}

#middle-win{

     float: left;
}

#right-win{
     width: 15px;
     background: url(okno/right-blue.png);
     float: left;
}

#bottom-left-win{
     width: 9px;
     background: url(okno/bottom-left-blue.png);
     float: left;
}

#bottom-middle-win{
    
     background: url(okno/bottom-middle-blue.png);  
     float: left;
}

#bottom-right-win{
     width: 15px;
     background: url(okno/bottom-right-blue.png);
     float: right;
}


Chcialbym, aby np. top-middle-win sam mi sie rozszezal. Moge to zrobic wpisujac styl padding, ale takich obramowan chce wiecej i nie bardzo mam ochote kopiowac ten kod wiele razy. Chcialbym, zeby to sie automatycznie robilo.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 25.04.2024 - 08:51