Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [html] Problem z przerobieniem na <div>
Sebastian003
post 28.12.2007, 11:27:06
Post #1





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

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


Witam !
Przerobiłem taką tabelkę na div
  1. <table align="center" border="0" width="80%">
  2. <tr>
  3. <td>OBRAZEK</td>
  4. <td>TEKST</td>
  5. <td>SZUKAJKA</td>
  6. </tr>

Dałem tak
  1. <div class="logo"></div>
  2. <div class="tekst"></div>
  3. <div class="tekst2"></div>

i css
  1. .logo
  2. {
  3. height:100px;
  4. width:300px;
  5. background:url(http://www.web-pc.pl/nowy/images/top.png);
  6. float: left;
  7. }
  8. .tekst
  9. {
  10. height:100px;
  11. width:300px;
  12. float: left;
  13. }
  14. .tekst2
  15. {
  16. height:100px;
  17. width:300px;
  18. float: left;
  19. }


ale potem jak złożyłem to to się wszytko rozwaliło sad.gif
link http://kameleon.web-pc.pl/regulamin.html
  1. <div class="legacySiteLinkBar"><a class="legacySiteLinkBar a">Info</a></div>
  2. <br>
  3. <div class="logo"></div>
  4. <div class="tekst"></div>
  5. <div class="tekst2"></div>
  6. <br>
  7. <div class="ost2">
  8. <a href="indexs.html">Home</a>
  9. <font color="#CACCBF" size="2">| </font><a href="faq.html">FAQ</a>
  10. <font color="#CACCBF" size="2">| </font><a href="regulamin.html">Regulamin</a>
  11. <font color="#CACCBF" size="2">| </font><a href="regulamin.html" onclick="return clickreturnvalue()" onmouseover="dropdownmenu(this, event, menu1, '133px')" onmouseout="delayhidemenu()">Obrazki</a>
  12. <font color="#CACCBF" size="2">| </font><a href="galerie.html">Galerie użytkowników</a>
  13. <font color="#CACCBF" size="2">| </font><a href="statystyki.html">Statystyki</a>
  14. <font color="#CACCBF" size="2">| </font><a href="reklama.html">Reklama</a>
  15. <font color="#CACCBF" size="2">| </font><a href="kontakt.html">Kontakt</a>
  16. </div>


Proszę o pomoc pozdrawiam !
Go to the top of the page
+Quote Post
ayeo
post 28.12.2007, 11:32:41
Post #2





Grupa: Przyjaciele php.pl
Postów: 1 202
Pomógł: 117
Dołączył: 13.04.2007
Skąd: 127.0.0.1

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


Zrób sobie dodatkowego diva, który będzie pojemnikiem na pozostałe. Te divy co już masz wżuć do środka i każdemu display: block;


--------------------
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 11:40:28
Post #3





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

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


Kurcze zrobiłem coś takiego ale problem nadal jest. Nie wiem czy cię dobrze zrozumiałem i tak zrobiłem ale wydaje mi się ze tak /
Go to the top of the page
+Quote Post
nevt
post 28.12.2007, 12:04:52
Post #4





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

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


kolego... masz totalny bajzel w kodzie tej strony...

nie masz znacznika <body>, znacznik <html> jest niedomknięty, są inne nie podomykane i/lub skrzyżowane znaczniki...
masz dwa razy sekcję <head> a pomiędzy pełno div'ów...
to, że wogóle cokolwiek się wyświetla, to tylko przypadek...

to tak po 30 sek. oglądania tego kodu...

Ten post edytował nevt 28.12.2007, 12:06:19


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 12:16:42
Post #5





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

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


Dzięki za krytyke błedy są ponieważ łacze lay kilkoma includowanymi plikami

wiec znacie odp !

Poprawiłem się nie ma błedó zadnych proszę o pomoc
Go to the top of the page
+Quote Post
nevt
post 28.12.2007, 12:41:02
Post #6





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

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


no - jestem pod wrażeniem smile.gif prawie dobrze, chociaż nadal są nie podomykane znaczniki
pod koniec został nie domknięty <p> , ale to akurat mniej istotne...

więc poprawiamy... po pierwsze zamiast
Kod
background:url(http://www.web-pc.pl/nowy/images/top.png);

powinno być
Kod
background-image: url('http://www.web-pc.pl/nowy/images/top.png');

po drugie znacznik <div class="divt"> nie jest nigdzie domknięty - wywal go... albo domknij... smile.gif
po trzecie do definicji klasy ost2 dodaj:
Kod
.ost2 { clear: both; }

wprowadź te poprawki i zobaczymy co dalej...

Ten post edytował nevt 28.12.2007, 12:43:43


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 13:09:09
Post #7





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

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


Prawie dobrze tylko jak wyśrodkować te

div

Kod
<div class="logo"></div>
<div class="tekst"></div>
<div class="tekst2"></div>


na środek strony bo

Kod
margin:0px auto;


nie pomaga



Ten post edytował Sebastian003 28.12.2007, 13:10:20
Go to the top of the page
+Quote Post
nevt
post 28.12.2007, 13:15:24
Post #8





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

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


miałem nadzieję, że już sam do tego dojdziesz... przywróć ten znacznik <div class="divt"> ale go DOMKNIJ za tymi floatowanymi elementami... a styl divt popraw na:
Kod
divt
{
  margin: 0px auto;
  width: 730px;
}


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 13:39:46
Post #9





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

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


Jeszcze 2 pytanka mam !

Jak zrobić zeby w div ten tekst bleble byl na samym dole diva

Kod
<div class="tekst">bleble</div>


i jak wycentrować tekst w div bo polecenie
Kod
text-align: center;

nie pomaga dotyczy to stopki
Go to the top of the page
+Quote Post
revyag
post 28.12.2007, 13:55:37
Post #10





Grupa: Przyjaciele php.pl
Postów: 2 258
Pomógł: 16
Dołączył: 21.09.2004
Skąd: Kielce

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


1. Po co Ci przy divach display:block, div z definicji jest elementem blokowym.
2. Stopkę masz niezależną od reszty treści, więc osobno musisz jej nadać szerokości, dopiero później centrować jej zawartości.
3. Co do ustawiania tekstu w divie to poczytaj:
http://perfectionorvanity.com/2006/04/19/w...trowaniu-w-css/


--------------------
-------------

------
Go to the top of the page
+Quote Post
nevt
post 28.12.2007, 13:59:24
Post #11





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

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


co do pierwszego (tekst u dołu div o wysokości 100px) - dodaj w stylu tego diva:
padding-top: 85px; (tak 'na oko'...)

co do drugiego (stopka) - masz tam <div id="copyright"> a stylujesz klasę "copyright" - dlatego ci nie działa...


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 14:20:54
Post #12





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

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


Co do drugiego miałeś racje zwyczajna pomyłka

a pierwsze to top sie opsunał zmniejszałem na mniejsza wartość nic nie daje

zobacz

http://kameleon.web-pc.pl/regulamin.html



Go to the top of the page
+Quote Post
nevt
post 28.12.2007, 15:16:59
Post #13





Grupa: Przyjaciele php.pl
Postów: 1 595
Pomógł: 282
Dołączył: 24.09.2007
Skąd: Reda, Pomorskie.

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


podstawy sie kłaniają ...
całkowita wysokość / szerokość bloku = height / width + padding + margin + border-width...
czyli jeśli hcesz mieć blok wysoki na 100px z paddingiem 85px to musisz ustawić height:15px


--------------------

-
Oh no, my young coder. You will find that it is you who are mistaken, about a great many things... -
Go to the top of the page
+Quote Post
sniezny_wilk
post 28.12.2007, 17:50:57
Post #14





Grupa: Zarejestrowani
Postów: 732
Pomógł: 80
Dołączył: 25.05.2005
Skąd: Szczecin

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


popraw dwa divy na

  1. .center
  2. {
  3. height:36px;
  4. width:483px;
  5. background-image: url('http://www.web-pc.pl/nowy/images/podmenu.png');
  6. float: left;
  7. margin:0px auto;
  8. }
  9. .center2
  10. {
  11. height:36px;
  12. width:240px;
  13. background-image: url('http://www.web-pc.pl/nowy/images/boczne.png');
  14. margin:0px auto 5px 490px;
  15. }


i usuń po:

  1. <div class="center2"></div>


znacznik "<br/>". Już lepiej to wygląda, teraz tylko wycentruj. Pokombinuj sam.


--------------------
Go to the top of the page
+Quote Post
Sebastian003
post 28.12.2007, 19:03:11
Post #15





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

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


Nic prawie to nie zmieniło sad.gif
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: 19.07.2025 - 18:33