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
BDCC
post
Post #2





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

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

@Zając zrobiłem tak, ale są dostępy w Operze miedzy tytułem menu, a menu...
Go to the top of the page
+Quote Post
Zajec
post
Post #3





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

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

Cytat(BDCC @ 1.06.2006, 13:01 ) *
@Zając zrobiłem tak, ale są dostępy w Operze miedzy tytułem menu, a menu...
Eh, a myślałem, że napisałem wystarczająco prostym i obrazowym językiem. Nie zastosowałeś żadnej podanej przeze mnie modyfikacji!

Popatrz na ten kod:
Kod
#tyt {
        background: url(layout/menu_title.gif);
        width: 137px;
        height: 26px;
        text-align: center;
        font-weight: bold;
        padding-top: 4px;
        border: 0px;
}


Wysokość elementu = height + padding-top + padding-bottom = 26px + 4px + 0px = 30px

A Twój obrazek http://xdcc.i-rpg.org/bdcc/hack/layout/menu_title.gif ma tylko 26px wysokości.

Zamień height: 26px; na height: 22px; i wtedy wysokość elementu wyjdzie Ci na właściwe 26px.

I zastosuj może moje pozostałe rady.




Cytat(mike_mech @ 18.05.2006, 00:03 ) *
Ja jeszcze dodam, że tak się dzieje w przeglądarkach.
W innych dziwnych aplikacjach typu bardzIEwIE interpretowane jest to wbrew standardom.

W IE nie będziesz musiał zmiejszać długości, bo IE traktuje padding jakby był na zewnątrz.

Przydadzą Ci się tutaj Conditional Comments dla wprowadzenia innych styli dla bardzIEwia.
Nie, nie, nie. Zbędne kombinowanie.

Wystarczy IE serwować w pierwszej linijce DOCTYPE strict i będzie ładnie działać.
Go to the top of the page
+Quote Post
mike
post
Post #4





Grupa: Przyjaciele php.pl
Postów: 7 494
Pomógł: 302
Dołączył: 31.03.2004

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

Cytat(Zajec @ 1.06.2006, 16:01 ) *
Cytat(mike_mech @ 18.05.2006, 00:03 ) *

Ja jeszcze dodam, że tak się dzieje w przeglądarkach.
W innych dziwnych aplikacjach typu bardzIEwIE interpretowane jest to wbrew standardom.

W IE nie będziesz musiał zmiejszać długości, bo IE traktuje padding jakby był na zewnątrz.

Przydadzą Ci się tutaj Conditional Comments dla wprowadzenia innych styli dla bardzIEwia.

Nie, nie, nie. Zbędne kombinowanie.

Wystarczy IE serwować w pierwszej linijce DOCTYPE strict i będzie ładnie działać.

Chyba raczej niezbędne (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Przecież nie przeskoczysz faktu, że poprawny dokument XHTML powienien być wysłany jako XML.
[HTML] pobierz, plaintext 
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" >
  5. <?!-- dalsza cz&#281;&#347;&#263; -->
[HTML] pobierz, plaintext


Conditional Comments są niestety jedynym uniwersalnym rozwiązaniem.
Go to the top of the page
+Quote Post
Zajec
post
Post #5





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

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

Cytat(mike_mech @ 17.06.2006, 21:25 ) *
Chyba raczej niezbędne (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Przecież nie przeskoczysz faktu, że poprawny dokument XHTML powienien być wysłany jako XML.

Owszem. Więc poprawny dokument XHTML wysyłamy tylko tym przeglądarkom, które chwalą się obsługą XHTMLa.


[PHP] pobierz, plaintext 
  1. <?php
  2. if (stristr($_SERVER[HTTP_ACCEPT], "application/xhtml+xml"))
  3. {
  4. header("Content-Type: application/xhtml+xml; charset=utf-8");
  5. echo '<?xml version="1.0" encoding="utf-8"?>'."rn";
  6. echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"'."rn";
  7. echo '"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">'."rn";
  8. }
  9. else
  10. {
  11. header("Content-Type: text/html; charset=utf-8");
  12. echo '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"'."rn";
  13. echo '"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">'."rn";
  14. }
  15. ?>
[PHP] pobierz, plaintext


Ten post edytował Zajec 21.06.2006, 09:12:11
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: 3.10.2025 - 01:23
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn