Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]table w div
Forum PHP.pl > Forum > Przedszkole
Ziom73
19.07.2009, 22:54:16
Mam news:
[PHP] pobierz, plaintext 
  1. <?php
  2. <table bgcolor="#C0C0C0" width="700">
  3. <tr>
  4.     <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  5. </tr>
  6. </table>
  7. <table bgcolor="#C0C0C0" width="700" height="200" >
  8. <tr>
  9. <td>
  10. <p style="font-family: arial">
  11. tu jest treść
  12. </p>
  13. </td>
  14. </tr>
  15. </table>
  16. ?>
[PHP] pobierz, plaintext

Ale w div nie działa, ponieważ wywala pod div ;/
Jak to naprawić, lub inaczej zrobić?
InosU31
19.07.2009, 23:01:49
a gdzie ten div questionmark.gif bo ja tu widze tylko table :| daj "kompletny" skrypt ;-)
Ziom73
19.07.2009, 23:11:37 
[PHP] pobierz, plaintext 
  1. <?php
  2. <div id="newst-bg">
  3.  <div id="newst">
  4. <div id="news-bg">
  5.  <div id="news">
  6. <center>
  7. <table bgcolor="#C0C0C0" width="700">
  8. <tr>
  9.    <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  10. </tr>
  11. </table>
  12. <table bgcolor="#C0C0C0" width="700" height="200" >
  13. <tr>
  14. <td>
  15. <p style="font-family: arial">
  16. tu jest treść
  17. </p>
  18. </td>
  19. </tr>
  20. </table>
  21. </center>
  22.    </div>
  23. </div>
  24. <div id="stopka-bg">
  25.  <div id="stopka">
  26.     <img src="images/stopka.png" />
  27.    </div>
  28. </div>
  29.    </div>
  30. </div>
  31. <br /><br /><br /><br />
  32. ?>
[PHP] pobierz, plaintext
InosU31
19.07.2009, 23:25:16
hmm ja mam u siebie :

<div class = "">

</div>

i u mnie nie ma problemu z wyswietleniem tego w div;-)

moze to problem w definicji tych "id" - bo widze ze masz np. width="700" a w zdefiniowanych stylach moze masz mniejsze wartosci width i dlatego ci wyswietla ponizej:|

a pokaz jeszcze co masz w stylach css
Ziom73
20.07.2009, 00:33:20 
[PHP] pobierz, plaintext 
  1. <?php
  2. #news-bg {border:0px solid yellow; position:relative; width:956px; height:500px; background-image: url(images/bg-s.png); background-repeat: repeat-y}
  3. #news {border:0px solid black; position:absolute; bottom:50%; right:50%;}
  4. #newst-bg {border:0px solid yellow; position:relative; width:1070px; height:500px; background-repeat: no-repeat; right top}
  5. #newst {border:0px solid black; position:absolute; bottom:0%; right:0%;}
  6. #stopka-bg {border:0px solid yellow; position:relative; width:0px; height:0px;}
  7. #stopka {border:0px solid black; position:absolute; bottom:-50px; right:-473px;}
  8. ?>
[PHP] pobierz, plaintext


W class, też nie działa:
[PHP] pobierz, plaintext 
  1. <?php
  2. <div class="newst-bg">
  3.  <div class="newst">
  4. <div class="news-bg">
  5.  <div class="news">
  6. <center>
  7. <table bgcolor="#C0C0C0" width="700">
  8. <tr>
  9.    <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  10. </tr>
  11. </table>
  12. <table bgcolor="#C0C0C0" width="700" height="200" >
  13. <tr>
  14. <td>
  15. <p style="font-family: arial">
  16. tu jest treść
  17. </p>
  18. </td>
  19. </tr>
  20. </table>
  21. </center>
  22.    </div>
  23. </div>
  24. <div class="stopka-bg">
  25.  <div class="stopka">
  26.     <img src="images/stopka.png" />
  27.    </div>
  28. </div>
  29.    </div>
  30. </div>
  31. <br /><br /><br /><br />
  32. ?>
[PHP] pobierz, plaintext 

[PHP] pobierz, plaintext 
  1. <?php
  2. .news-bg {border:0px solid yellow; position:relative; width:956px; height:500px; background-image: url(images/bg-s.png); background-repeat: repeat-y}
  3. .news {border:0px solid black; position:absolute; bottom:50%; right:50%;}
  4. .newst-bg {border:0px solid yellow; position:relative; width:1070px; height:500px; background-repeat: no-repeat; right top}
  5. .newst {border:0px solid black; position:absolute; bottom:0%; right:0%;}
  6. .stopka-bg {border:0px solid yellow; position:relative; width:0px; height:0px;}
  7. .stopka {border:0px solid black; position:absolute; bottom:-50px; right:-473px;}
  8. ?>
[PHP] pobierz, plaintext
InosU31
20.07.2009, 00:44:34
nie wiem czy o to Ci chodzilo ale przerobilem to troche:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/htm14/loose.dtd">
  3. <html>
  4. <head>
  5. <link rel="stylesheet" href="style.css" type="text/css" />
  6. </head>
  7. <body>
  8.  
  9. <center>
  10. <div id="newst-bg">aaaa
  11. 	<div id="newst">logo
  12.  
  13. 	</div>
  14. 		<div id="news-bg">bok
  15. 		</div>
  16. 			<div id="news">
  17. <center>
  18. <table bgcolor="#C0C0C0" width="700">
  19. <tr>
  20.   <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  21. </tr>
  22. </table>
  23. <table bgcolor="#C0C0C0" width="700" height="200" >
  24. <tr>
  25. <td>
  26. <p style="font-family: arial">
  27. tu jest treść
  28. </p>
  29. </td>
  30. </tr>
  31. </table>
  32. </center>
  33.   				</div>
  34. 			</div>
  35. <div id="stopka-bg">ddd
  36. <div id="stopka">
  37.    <img src="images/stopka.png" />
  38.   </div>
  39. </div>
  40.  
  41.  
  42. <br /><br /><br /><br />
  43. </center>
  44. </body>
  45. </html>
[HTML] pobierz, plaintext


plik style.css:
[HTML] pobierz, plaintext 
  1. #newst-bg {border:1px solid yellow; overflow:auto; width:900px; height:auto; background-repeat: no-repeat; right top}
  2. #newst {border:1px solid green; float:left; width:890px; height:50px;}
  3. #news-bg {border:1px solid yellow; float:left; width:100px; height:300px; background-image: url(images/bg-s.png); background-repeat: repeat-y}
  4. #news {border:1px solid black; float: left; bottom:20px; padding: 20px 0px; margin-left:50px;}
  5. #stopka-bg {border:1px solid red; position:relative; width:900px; height:100; margin-top:10px; margin-left:auto; margin-right:auto}
  6. #stopka {border:1px solid black; float: right; width: auto; height:auto; }
[HTML] pobierz, plaintext


nie moge wyswietlic jak to u mnie wyglada to co dales bo nie wiem jak zrobic zrzut ekranu a tym laptopie ale zrob sobie dwa pliki jeden index.html i drugi style.css i wklej te zawartosci i zobaczysz co tam zrobilem bo nie wiem czy o to ci chodzilo.


pozdrawiam

ps. u mnie to wyswietla jakos dziwnie ta tabelke ale w divach nie pod:|
Ziom73
20.07.2009, 00:55:02
Ale masakra jest teraz, hehe party.gif >> http://site.thawsite.cba.pl/index2.php
ps. zobacz w google chrome bo na IE nie działa stronka haha.gif

Chyba będę musiał poszukać innego rozwiązania niż table ;p
InosU31
20.07.2009, 01:08:44
to sprobuj tak :
[HTML] pobierz, plaintext 
  1. #news {border:1px solid yellow; position:relative; width:auto; height:auto; background-repeat: no-repeat; right top}
  2. #stopka {border:1px solid red; position:relative; width:auto; height:auto; margin-top:10px; margin-left:auto; margin-right:auto}
[HTML] pobierz, plaintext 



[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/htm14/loose.dtd">
  3. <html>
  4. <head>
  5. <link rel="stylesheet" href="style.css" type="text/css" />
  6. </head>
  7. <body>
  8.  
  9. <center>
  10. <div id="news">
  11.  
  12. <table bgcolor="#C0C0C0" width="700">
  13. <tr>
  14.   <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  15. </tr>
  16. </table>
  17. <table bgcolor="#C0C0C0" width="700" height="200" >
  18. <tr>
  19. <td>
  20. <p style="font-family: arial">
  21. tu jest treść
  22. </p>
  23. </td>
  24. </tr>
  25. </table>
  26. </center>
  27. 			</div>
  28. <div id="stopka">
  29.    <img src="images/stopka.png" />
  30.   </div>
  31.  
  32.  
  33. <br /><br /><br /><br />
  34. </center>
  35. </body>
  36. </html>
[HTML] pobierz, plaintext


zobacz teraz moze cos pomoze a jak nie to na samych divach sprobuj zamiast <table> ;-)

na IE :
<a href='http://zapodaj.net/4f17d3e233b1.gif.html'>http://zapodaj.net/4f17d3e233b1.gif.html</a>

na chrome:

<a href='http://zapodaj.net/796931cf152b.gif.html'>http://zapodaj.net/796931cf152b.gif.html</a>
Ziom73
20.07.2009, 01:13:46
Nadal nie ma >> http://site.thawsite.cba.pl/index2.php

ps. idę spać będę ok. 11.00
InosU31
20.07.2009, 01:31:01
zamiast "position:relative;" wpisz overflow:auto; moze cos pomoze pozatym zamiast table sprobuj zrobic to na divach wszystko;-) bo tak ci sie wyswietla do lewej pewnie przez to <p></p>.

ciezko cos poradzic bo to jest wewnatrz jakiegos innego kodu. no nic pozdrawiam;-)
Ziom73
20.07.2009, 15:26:38
Zrobiłem to bez table, bo same problemy są ;p :
[PHP] pobierz, plaintext 
  1. <?php
  2. <div id="newst-bg">
  3.  <div id="newst">
  4. <div id="news-bg">
  5.  <div id="news">
  6. <font color="maroon"><h1><p style="font-family: fantasy">Wielkie otwarcie!</p></h1><hr></font>
  7. tu jest tekst
  8.    </div>
  9. </div>
  10. <div id="stopka-bg">
  11.  <div id="stopka">
  12.     <img src="images/stopka.png" alt="Powered By Ziom73 And PHPLogin, ˆ2008-2009" />
  13.    </div>
  14. </div>
  15.    </div>
  16. </div>
  17. <br /><br /><br /><br />
  18. ?>
[PHP] pobierz, plaintext


Mam 2 pytanie jak zrobić aby <hr> był bezpośrednio pod tekstem, a nie 3 linijki pod?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.