Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]table w div
Forum PHP.pl > Forum > Przedszkole
Ziom73
Mam news:
  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. ?>

Ale w div nie działa, ponieważ wywala pod div ;/
Jak to naprawić, lub inaczej zrobić?
InosU31
a gdzie ten div questionmark.gif bo ja tu widze tylko table :| daj "kompletny" skrypt ;-)
Ziom73
  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. ?>
InosU31
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
  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. ?>


W class, też nie działa:
  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. ?>

  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. ?>
InosU31
nie wiem czy o to Ci chodzilo ale przerobilem to troche:
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/htm14/loose.dtd">
  3. <link rel="stylesheet" href="style.css" type="text/css" />
  4. </head>
  5.  
  6. <div id="newst-bg">aaaa
  7. <div id="newst">logo
  8.  
  9. </div>
  10. <div id="news-bg">bok
  11. </div>
  12. <div id="news">
  13. <table bgcolor="#C0C0C0" width="700">
  14. <tr>
  15. <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  16. </tr>
  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. </div>
  26. </div>
  27. <div id="stopka-bg">ddd
  28. <div id="stopka">
  29. <img src="images/stopka.png" />
  30. </div>
  31. </div>
  32.  
  33.  
  34. <br /><br /><br /><br />
  35. </body>
  36. </html>


plik style.css:
  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; }


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
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
to sprobuj tak :
  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}



  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
  2. "http://www.w3.org/TR/htm14/loose.dtd">
  3. <link rel="stylesheet" href="style.css" type="text/css" />
  4. </head>
  5.  
  6. <div id="news">
  7.  
  8. <table bgcolor="#C0C0C0" width="700">
  9. <tr>
  10. <td><font color="maroon"><h1><p style="font-family: fantasy"><span style='background-color:#EEEEEE;padding:2px'>Wielkie otwarcie!</span></p></h1></font></td>
  11. </tr>
  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. </div>
  21. <div id="stopka">
  22. <img src="images/stopka.png" />
  23. </div>
  24.  
  25.  
  26. <br /><br /><br /><br />
  27. </body>
  28. </html>


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
Nadal nie ma >> http://site.thawsite.cba.pl/index2.php

ps. idę spać będę ok. 11.00
InosU31
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
Zrobiłem to bez table, bo same problemy są ;p :
  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. ?>


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.