Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [html][css] problem z paddiing-right
Bakczki
post
Post #1





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 27.10.2009

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

Potrzebuję stworzyć prostą stronę z użyciem html. Żeby wszystko ładnie wyglądało zastosowałem css. Niestety tu pojawia się mój problem. Chcę umieścić przyciski "Strona główna" "Galeria" i "kontakt" po lewej stronie strony. Niestety funkcja padding-right nie chce mi zaskoczyć, za to padding-left, którego nie potrzebuję jak na złość działa prawidłowo.

link do strony:

www.bam.boo.pl

kod strony html:

[HTML] pobierz, plaintext 
  1.  
  2. <title>bam.boo.pl</title>
  3.  
  4. <head>
  5. 	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  6. 	<link rel="stylesheet" href="style.css" type="text/css" />
  7. </head>
  8.  
  9. <body>
  10.  
  11. <buttony>
  12. <a href="index.php"><img src="images/sg-button.png" alt="Strona główna" /></a>
  13. <a href="galeria.php"><img src="images/g-button.png" alt="Galeria" /></a>
  14. <a href="kontakt.php"><img src="images/k-button.png" alt="Galeria" /></a>
  15. </buttony>
  16.  
  17. <div id="goran"></div>
  18. <div id="naglowek">
  19.  
  20. Strona Główna
  21.  
  22. </div>
  23. <div id="doln"></div>
  24. <div id="strona">
  25. <div id="H1">
  26. PHP ? obiektowy, skryptowy język programowania zaprojektowany do generowania stron internetowych w czasie rzeczywistym. PHP jest najczęściej stosowany do uruchamiania skryptów po stronie serwera WWW, ale może być on również używany do przetwarzania danych z poziomu wiersza poleceń, a nawet do pisania programów pracujących w trybie graficznym (np. za pomocą biblioteki GTK+). Implementacja PHP wraz z serwerem WWW Apache oraz serwerem baz danych MySQL określana jest jako platforma AMP (w środowisku Linux - LAMP, w Windows - WAMP).
  27. </div>
  28. </div>
  29. <div id="dols"></div>
  30. </body>
  31.  
[HTML] pobierz, plaintext


Kod css:

[HTML] pobierz, plaintext 
  1.  
  2. body
  3.  
  4. {
  5. 		background: url(images/tlo.jpg) repeat;
  6.         background-color: #000000;
  7. 		width:664px;
  8. 		margin-top:140px;
  9. 		margin-left:auto;
  10. 		margin-right:auto;
  11. 		margin-bottom:40px;
  12. 		list-style: none;
  13. }
  14.  
  15. buttony
  16.  
  17. {
  18.  
  19. 		marign-top: 300px;
  20. 		padding-right: 100px;
  21.  
  22. }
  23.  
  24. #H1
  25.  
  26. {
  27.  
  28. 	font: Arial 10 px;
  29. 	color: white ;
  30.  
  31. }
  32.  
  33. #goran
  34.  
  35. {
  36.         background: url(images/gora.png) repeat;
  37.         height:10px;
  38. }
  39.  
  40. #naglowek
  41.  
  42. {
  43.         font: Arial 15px #FFF;
  44.         background: #000000 ;
  45.         height:200px;
  46. }
  47.  
  48. #doln
  49.  
  50. {
  51.         background: #000000 ;
  52.         height:11px;
  53. }
  54.  
  55. #strona
  56.  
  57. {
  58.         background: #000000 ;
  59. 	border-left-width: 30px;
  60. 		height:800px;
  61. }
  62.  
  63.  
  64. #dols
  65.  
  66. {
  67.         background: url(/images/dol.png) repeat ;
  68.         height:11px;
  69. 	marign-bottom:auto;
  70. }
  71.  
[HTML] pobierz, plaintext


Proszę o podpowiedź, gdzie znajduje się błąd.

Edit:

Mam jeszcze małe pytanko. Jak zrobić żeby tekst wyświetlał się w odstępach około 6 px od krawędzi strony ?

Edit2:

Nie mogę znaleźć nigdzie informacji jak zlikwidować ramkę, wokół linku obrazkowego. Zna ktoś na to kod ?

Ten post edytował Bakczki 27.10.2009, 22:00:31
Go to the top of the page
+Quote Post
wookieb
post
Post #2





Grupa: Moderatorzy
Postów: 8 989
Pomógł: 1550
Dołączył: 8.08.2008
Skąd: Słupsk/Gdańsk
Kompletnie źle podchodzisz do tematu
http://kurs.browsehappy.pl/

Co to za tag "buttony"? Nie używasz poprawnie tagów (nie ma doctype, title poza sekcja head) Uporządku je. Przejrzyj kurs. Buttony po lewej stronie tzn? Fajnie by było gdybyś np narysował nawet w paintcie gdzie chcesz je umieścić.

P.s. Temat powinien być przyklejony jako wzór dla głąbów którzy
1) nie dają kodu z którym mają problem
2) jak dają to zanim sobie go uruchomisz to tracisz 2 minuty
3) nie podają linku do strony, tylko kod
Gz dla ciebie bo wszystkie punkty ominąłeś smile.gif Wzorowy temat. I teraz nie ma tłumaczenia głąbów "jestem nowy" smile.gif

Ten post edytował wookieb 27.10.2009, 22:03:55


--------------------
9marshals.com, Fantastyka, Parser bbcode ( UPDATE 1.2 ), Kalkulator wielkości informatycznych
Go to the top of the page
+Quote Post
blade-mrn
post
Post #3





Grupa: Zarejestrowani
Postów: 113
Pomógł: 11
Dołączył: 20.10.2009

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

Po pierwsze jak wyżej, skąd wziąłeś ten tag buttony ? Po drugie na CSS-ie nie znam się zbyt dobrze ale czy padding nie określa odległości danego elementu od marginesu strony (tak a pro po twojego drugiego pytania) questionmark.gif Więc jeśli mam racje to musisz te hiperłącza ustawić po prawej stronie i za pomocą padding-right ustalić sobie ich odległość od prawej krawędzi. Trochę pokrętnie to napisałem ale zamień tag <buttony> na coś takiego to zobaczysz o czym mówię:
[HTML] pobierz, plaintext 
  1. <div class="buttony"align="right">
  2. <a href="index.php"><img src="images/sg-button.png" alt="Strona główna" /></a>
  3. <a href="galeria.php"><img src="images/g-button.png" alt="Galeria" /></a>
  4. <a href="kontakt.php"><img src="images/k-button.png" alt="Galeria" /></a>
  5. </div>
[HTML] pobierz, plaintext

a w stylach daj kropkę przed buttony:
[CSS] pobierz, plaintext 
  1. .buttony { marign-top: 300px; padding-right: 300px; }
[CSS] pobierz, plaintext


Ten post edytował blade-mrn 27.10.2009, 22:19:06


--------------------
"Wszyscy wiedzą, że czegoś nie da się zrobić, i przychodzi taki jeden, który nie wie, że się nie da, i on to właśnie robi."
Albert Einstein
Go to the top of the page
+Quote Post
Bakczki
post
Post #4





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 27.10.2009

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

Coś ze mną nie tak...

Strona którą chcę zrobić.



blade-mrn:

Poprawiłem już składnię, ale niestety problem dalej pozostał.

Ten post edytował Bakczki 27.10.2009, 23:16:12
Go to the top of the page
+Quote Post
t4keda
post
Post #5





Grupa: Zarejestrowani
Postów: 57
Pomógł: 10
Dołączył: 14.10.2009

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

Jeśli chodzi o obramowanie wokół buttonów. To w CSS stosuje się coś takiego jak zerowanie czyli na samym początku pliku CSS dajesz coś takiego:
[CSS] pobierz, plaintext 
  1. * {
  2. padding: 0;
  3. margin: 0;
  4. border: none;
  5. text-decoration: none;
  6. }
[CSS] pobierz, plaintext


Dalej, jeśli chcesz mieć menu po lewej stronie, to nie używaj padding, bo to raczej nie pomoże.

daj coś takiego:
[CSS] pobierz, plaintext 
  1. .buttony {
  2. float: left;
  3. }
[CSS] pobierz, plaintext

I na koniec: menu robi się na liście: http://www.kurshtml.boo.pl/css/pionowe_menu,menu.html
I wstaw poprawny doctype: http://www.kurshtml.boo.pl/html/ramy_dokumentu,zielony.html

Na chwilę obecną to powinno starczyć.
Go to the top of the page
+Quote Post
wookieb
post
Post #6





Grupa: Moderatorzy
Postów: 8 989
Pomógł: 1550
Dołączył: 8.08.2008
Skąd: Słupsk/Gdańsk
Cytat(Bakczki @ 27.10.2009, 22:44:05 ) *
Wookieb:

Jeżeli oczy mnie nie mylą, to trafiłem dobrze do działu dla początkujących. Jeśli dostajesz padaczki na widok złej składni, to radzę Ci nie wchodź tutaj. Tak poza tym przeglądając forum zauważyłem, że potrafisz tylko ubliżać. Weź idź sobie pograj w Simsy czy coś, chociaż nie wiem czy to coś pomoże, bo z tego co widzę to jesteś raczej toksyczną osobą. Tak czy owak, lubisz nabijać posty bo nie pomogłeś mi ani trochę.

Specjalnie dla niedomyślnych ludzi takich jak ty sporządziłem projekt w paincie:

Człowieku wyluzuj. Przecież cię pochwaliłem a ty do mnie z zębami. Weź się opanuj i przeczytaj kurs, który ci podałem.
Jak ci zwracam uwagam na tagi to nie bo mi się nudzi (uwierz mi gdybym NIE CHCIAŁ pomóc to bym nie pisał, ale skoro CHCE to też czynię, więc daruj sobie takie teksty), tylko że taka jest prawda. Jak cię to nie interesuje to twój problem ale i tak będziesz musiał się tego nauczyć.

Poza tym ludzie jak mówią "po lewej stronie" to nawet nie zdajesz sobie sprawy co mają na myśli.
Nowy a już przejrzał wszystkie moje posty? Czyżby multikonto?

Ten post edytował wookieb 27.10.2009, 23:03:45


--------------------
9marshals.com, Fantastyka, Parser bbcode ( UPDATE 1.2 ), Kalkulator wielkości informatycznych
Go to the top of the page
+Quote Post
Bakczki
post
Post #7





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 27.10.2009

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

No dobra przepraszam jestem dzisiaj nie do życia, ale dzisiaj szukałem pomocy na innych forach i jestem jakoś przewrażliwiony na punkcie szukania pomocy w szukajce, w której nic nie można znaleźć, oraz składni której uczyłem się kilka dni bez przerwy. Jestem matołem i w ogóle sorry smile.gif



Poprawiłem wszystko i zastosowałem

float-left;

ale jakoś te przyciski mi nie chcą wskoczyć na właściwe miejsce.

Ten post edytował Bakczki 27.10.2009, 23:13:37
Go to the top of the page
+Quote Post
wookieb
post
Post #8





Grupa: Moderatorzy
Postów: 8 989
Pomógł: 1550
Dołączył: 8.08.2008
Skąd: Słupsk/Gdańsk
2 kolumnowy layout http://www.neuroticweb.com/recursos/2-columns-layout/ Trochę zmodyfikuj a w twoim przypadku przyda się padding-top dla "SIDE A" Header i bottom możesz wywalić. Do SIDE B wrzucasz swój top i content.


--------------------
9marshals.com, Fantastyka, Parser bbcode ( UPDATE 1.2 ), Kalkulator wielkości informatycznych
Go to the top of the page
+Quote Post
Bakczki
post
Post #9





Grupa: Zarejestrowani
Postów: 4
Pomógł: 0
Dołączył: 27.10.2009

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

Dzięki za pomoc i cierpliwość, bardzo mi pomogliście.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

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

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

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