Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> div+css
BDCC
post
Post #1





Grupa: Zarejestrowani
Postów: 25
Pomógł: 0
Dołączył: 27.01.2006

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

Mam problem... Poprawiam stronę kolegi, która w każdej przeglądarce inaczej się wświetla... Jego strona była w tabelkach, ja w myśl o nowoczesności używam diva (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif) Jest pewien problem... Oto link do tego layu: lo.gif' target='_blank pod tym. Ja zrobiłem coś takiego:
[HTML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="ISO-8859-2"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6. <style type="text/css">
  7. <!--
  8. * {
  9.         margin: 0;
  10.         padding: 0;
  11.         border: 0;
  12. }
  13.  
  14. body {
  15.         font: 12px Helvetica, Tahoma, Arial, sans-serif;
  16.         font-weight: normal;
  17.         color: #FFFFFF;
  18.         background: #4B4B4B;
  19.         margin: 0px auto;
  20.         padding: 0px;
  21.         text-align: center;
  22. }
  23.  
  24. h1 {
  25.         color: #FFFFFF;
  26.         font-size: 20px;
  27.         font-weight: bold;
  28.         text-decoration: none;
  29.         text-align: center;
  30.         font-face: Times New Roman;
  31. }
  32.  
  33. a {
  34.         color: #FFFFFF;
  35.         text-decoration: none;
  36. }
  37.  
  38. a:hover {
  39.         color: #FFFFFF;
  40.         text-decoration: none;
  41.         font-weight: bold;
  42. }
  43.  
  44. th {
  45.         background: #000000;
  46.         color: #FFFFFF;
  47. }
  48.  
  49. #glowny {
  50.         text-align: center;
  51.         background: #4B4B4B;
  52.         padding: 0px;
  53.         width: 777px;
  54. }
  55.  
  56. #top {
  57.         background: url(layout/logo.jpg) no-repeat top;
  58.         padding: 0px;
  59.         width: 777px;
  60.         height: 78px;
  61. }
  62.  
  63. #pasek {
  64.         background: url(layout/top_tlo.gif) repeat-x top;
  65.         padding: 10px;
  66.         font-weight: bold;
  67.         padding-top: 0px;
  68.         width: 777px;
  69.         height: 78px;
  70.         vertical-align: top;
  71.         text-align: left;
  72. }
  73.  
  74. #pasek a:hover {
  75.         text-decoration: underline;
  76. }
  77.  
  78. #lewe {
  79.         width: 150px;
  80.         background-color: green;
  81.         float: left;
  82. }
  83.  
  84. #srodek {
  85.         width: 400px;
  86.         background-color: grey;
  87.         float: left;
  88. }
  89.  
  90. #prawe {
  91.         width: 150px;
  92.         background-color: green;
  93.         float: right;
  94. }
  95.  
  96. #stopka {
  97.         width: 777px;
  98.         height: 20px;
  99.         background-color: pink;
  100.         clear: both;
  101. }
  102.  
  103. #deo {
  104.         background: url(layout/deo.jpg) no-repeat top right;
  105.         padding: 0px;
  106.         width: 111px;
  107.         height: 68px;
  108.         position: relative;
  109.         left: 656 px;
  110.             top: 190 px;
  111. }
  112. #deoz {
  113.         padding: 0px;
  114.         width: 777px;
  115.          position: relative;
  116.        
  117.             
  118. -->
  119. </style>
  120.  
  121. <body>
  122. <div id="glowny">
  123. <div id="top"></div>
  124. <div id="pasek"></div>
  125. <div id="deo">a</div>
  126. <div id="lewe">Menu lewe</div>
  127. <div id="srodek">Srodek</div>
  128. <div id="prawe">Menu prawe</div>
  129. <div id="stopka">Stopka</div>
  130. </div>
  131. </body>
  132. </html>
[HTML] pobierz, plaintext


Co zrobić, aby było tak samo w divie? Próbowałem różnych metod i żadna nie pomaga....

Ten post edytował BDCC 5.05.2006, 20:27:09
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi
Zajec
post
Post #2





Grupa: Zarejestrowani
Postów: 1 086
Pomógł: 8
Dołączył: 10.12.2003

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

Wcisnąć tam img z float:right :-) Poza tym jeśli już zadeklarowałeś domyślne wartości margin i padding na 0 (poprzez * { }) to nie musisz ich ponownie zerować dla poszczególnych bloków.

http://zajec.net/test/pokemony

[HTML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="ISO-8859-2"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head>
  6. <base href="http://www.pokemony.com/hack/" />
  7. <style type="text/css">
  8. * {
  9.        margin: 0;
  10.        padding: 0;
  11.        border: 0;
  12. }
  13.  
  14. body {
  15.        font: 12px Helvetica, Tahoma, Arial, sans-serif;
  16.        font-weight: normal;
  17.        color: #FFFFFF;
  18.        background: #4B4B4B;
  19. }
  20.  
  21. h1 {
  22.        color: #FFFFFF;
  23.        font-size: 20px;
  24.        font-weight: bold;
  25.        text-decoration: none;
  26.        text-align: center;
  27.        font-face: Times New Roman;
  28. }
  29.  
  30. a {
  31.        color: #FFFFFF;
  32.        text-decoration: none;
  33. }
  34.  
  35. a:hover {
  36.        color: #FFFFFF;
  37.        text-decoration: none;
  38.        font-weight: bold;
  39. }
  40.  
  41. th {
  42.        background: #000000;
  43.        color: #FFFFFF;
  44. }
  45.  
  46. #glowny {
  47.        margin: 0 auto;
  48.        background: #4B4B4B;
  49.        width: 777px;
  50. }
  51.  
  52. #top {
  53.        background: url(layout/logo.jpg) no-repeat top;
  54.        width: 777px;
  55.        height: 78px;
  56. }
  57.  
  58. #pasek {
  59.        background: url(layout/top_tlo.gif) repeat-x top;
  60.        font-weight: bold;
  61.        width: 777px;
  62.        height: 78px;
  63.        text-align: center;
  64. }
  65.  
  66. #pasek a:hover {
  67.        text-decoration: underline;
  68. }
  69.  
  70. #lewe {
  71.        width: 150px;
  72.        background-color: green;
  73.        float: left;
  74. }
  75.  
  76. #srodek {
  77.        width: 400px;
  78.        background-color: grey;
  79.        float: left;
  80. }
  81.  
  82. #prawe {
  83.        width: 150px;
  84.        background-color: green;
  85.        float: right;
  86. }
  87.  
  88. #stopka {
  89.        width: 777px;
  90.        height: 20px;
  91.        background-color: pink;
  92.        clear: both;
  93. }
  94. </style>
  95.  
  96. <body><div id="glowny>
  97.  
  98. <div id="top"></div>
  99.  
  100. <div id="pasek">
  101.       <a href="/hack/index.php">Strona główna</a> | 
  102.       <a href="http://firefoks.be/anime/">Forum Dyskusyjne</a>
  103.       <img src="layout/deo.jpg" style="float: right;" />
  104. </div>
  105.  
  106. <div id="lewe">
  107.       Menu lewe
  108. </div>
  109.  
  110. <div id="srodek">
  111.       Srodek
  112. </div>
  113.  
  114. <div id="prawe">
  115.       Menu prawe
  116. </div>
  117.  
  118. <div id="stopka">
  119.       Stopka
  120. </div>
  121.  
  122. </div></body>
  123. </html>
[HTML] pobierz, plaintext

Pamiętaj, żeby IE nie serwować kodu
Kod
<?xml version="1.0" encoding="ISO-8859-2"?>
Go to the top of the page
+Quote Post

Posty w temacie
- BDCC   div+css   5.05.2006, 19:07:23
- - Zajec   Wcisnąć tam img z float:right :-) Poza tym jeśli j...   6.05.2006, 09:06:58
- - BDCC   Teraz mam trochę inny problem. Chodzi o menu.. Zau...   16.05.2006, 17:21:16
- - mike_mech   Menu tutaj to prosta sprawa. Dajesz tak. [HTML] po...   16.05.2006, 17:27:24
- - Zajec   Gdybyś podawał link do wersji nad którą aktualnie ...   16.05.2006, 18:19:13
- - BDCC   Orginał: http://www.pokemony.com/hack/ Obrazki: ht...   17.05.2006, 22:31:15
- - Zajec   Teraz znacznie lepiej, zaraz to elegancko przerobi...   17.05.2006, 22:58:15
- - mike_mech   Cytat(Zajec @ 2006-05-17 23:58:15)1) Zapomina...   17.05.2006, 23:03:01
- - BDCC   @Zając zrobiłem tak, ale są dostępy w Operze miedz...   1.06.2006, 12:01:37
|- - Zajec   Cytat(BDCC @ 1.06.2006, 13:01 ) @Zając zr...   1.06.2006, 15:01:28
|- - mike_mech   Cytat(Zajec @ 1.06.2006, 16:01 ) Cytat(mi...   17.06.2006, 20:25:07
|- - Zajec   Cytat(mike_mech @ 17.06.2006, 21:25 ) Chy...   21.06.2006, 09:10:35
- - BDCC   http://xdcc.i-rpg.org/bdcc/hack/nowy2.html Na koń...   17.06.2006, 18:32:29
- - mike_mech   ~Zajec zakładasz użycie innej technologi...   21.06.2006, 09:25:17
- - BDCC   Odrazu lepiej Tylko chyba skrypt jest troche z...   23.06.2006, 21:57:44
- - Vogel   jizas. wklejasz kod php do HTMLa? to nie bedize dz...   23.06.2006, 22:40:04
- - BDCC   http://xdcc.i-rpg.org/bdcc/hack/nowy3.php <- lo...   24.06.2006, 10:04:31
- - Vogel   nie "lol" tylko nie potrafisz zlozyc por...   24.06.2006, 10:39:21
- - BDCC   http://xdcc.i-rpg.org/bdcc/hack/nowy3.php <- b...   17.07.2006, 18:19:51
|- - Zajec   Cytat(BDCC @ 17.07.2006, 19:19 ) http://x...   17.07.2006, 22:30:00
- - BDCC   http://xdcc.i-rpg.org/bdcc/hack/nowy3.php <- wy...   18.07.2006, 08:22:26

« Następny starszy · CSS · Następny nowszy »
 

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

 

Tryb wyświetlania: Przełącz na: Standardowy · Przełącz na: Linearny+ · Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 6.10.2025 - 18:33
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn