Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Odleglosc miedzy divami
Dandelion
post
Post #1





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

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

Mam taki kod

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html 
  2. PUBLIC "-//W3C//DTD XHTML 1.0//EN" 
  3. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> 
  5. <head>
  6. <title>Tytuł strony</title>
  7. <link rel="stylesheet" href="style.css" type="text/css"/> 
  8. </head>
  9. <body>
  10.  
  11.  
  12.  
  13. <div id="logo">1</div> 
  14.  
  15. <div id="menu">
  16.       <form action="dodaj" method="POST" style="style.css" class="formularz">
  17.              <input type="image" VALUE="pokaz" src="images/podstawowa2.gif">
  18.              <input type="image" VALUE="szukaj" src="images/podstawowa2.gif">
  19.              
  20.       </form>
  21.       
  22.  
  23. <div id="menu2">
  24.       <form action="dodaj" method="POST" style="style.css" class="formularz2">
  25.  
  26. <div>
  27.             <textarea name="dodaj" cols="50" rows="10"></textarea>
  28. </div>
  29.             <input type="image" VALUE="wyslij" src="images/dodaj.gif">
  30.       </form>
  31.  
  32. </div>      
  33. </div>
  34.  
  35.  
  36.  
  37.  
  38. </body>
  39. </html>
[HTML] pobierz, plaintext


css

[HTML] pobierz, plaintext 
  1. body { 
  2. margin: 5px;
  3. padding: 5px;
  4. }
  5.  
  6.  
  7. div#logo { 
  8. background-color: white;
  9. height: 100px;
  10. }
  11.  
  12. div#menu { 
  13. width : 100%;
  14. height: 50px;
  15. text-align : center;
  16. background-color : #e6e6e6;
  17. }
  18.  
  19. div#menu2 { 
  20.  
  21. }
[HTML] pobierz, plaintext



Efekt jaki uzyskuje to



chcialbym natomiast zeby wygladalo to tak



na chlopski rozum dwa <p> zalatwiaja sprawe jednak nie podoba mi sie to rozwiazanie i chcialbym w pliku css ustalic odleglosc miedzy dwoma divami problem w tym ze nie wiem jak to zrobic winksmiley.jpg

kolejna sprawa to errory jakie dostaje w validatorze

http://validator.w3.org/

nie bede ich wklejal bo za duzo miejsca zajmuja jezeli ktos by mogl sprawdzic i nakierowac mnie czemu one wyskakuje bylbym bardzo wdzieczny


kolejna sprawa jak w css ustawic tlo przyciskow submit i reset w formularzu

Ten post edytował Dandelion 14.04.2006, 21:43:36
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 12)
vieri_pl
post
Post #2





Grupa: Zarejestrowani
Postów: 406
Pomógł: 9
Dołączył: 24.07.2005
Skąd: Bydgoszcz

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

eh... css:

Kod
#menu {
width : 100%;
height: 50px;
text-align : center;
background-color : #e6e6e6;
margin-bottom: 10px;
}


co do reset i submit:

Kod
input {;
text-align : center;
background-color : #000;
color: #fff;
}


Co do errorow to pewnie chodzi o formularze tongue.gif masz je zle napisane...

polecam to:

http://www.sitepoint.com/article/style-web-forms-css/


pozdrawiam
Go to the top of the page
+Quote Post
Dandelion
post
Post #3





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

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

dzieki za odpowiedz

co do mojego pytania o tlo, to mialem na mysli tlo graficzne faktycznie zle napisalem ;]

a co do marginesow to dalej nie dziala

Ten post edytował Dandelion 14.04.2006, 22:14:40
Go to the top of the page
+Quote Post
Zajec
post
Post #4





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

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

Cytat(Dandelion @ 2006-04-14 22:08:15)
a co do marginesow to dalej nie dziala

Może z powodu paddingu/margunesu elementu <form>?

Proponuję dodać na samym początku arkusza stylów
Kod
* { margin: 0; padding: 0; }


Osobiście bez takiego czegoś nie zaczynam pisać stron.
Go to the top of the page
+Quote Post
Dandelion
post
Post #5





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

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

dodalem to na poczatku stylu

* {
margin: 0;
padding: 0;
}

potem

#menu {
width : 100%;
height: 50px;
text-align : center;
background-color : #e6e6e6;
margin-bottom: 10px;
}

no i nic chcialem sprawdzicy czy 10 px to przypadkiem nie za malo wiec dalem 100000px ale w dalszym ciagu nie ma zadnej zmiany w operze
Go to the top of the page
+Quote Post
ens0re
post
Post #6





Grupa: Zarejestrowani
Postów: 143
Pomógł: 0
Dołączył: 23.08.2005
Skąd: Warszawa

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

Wydaje mi się, że dzieje sie tak dlatego, gdyż diva #menu2 masz w divie #menu. Sprawdz tak:
[HTML] pobierz, plaintext 
  1. <div id="logo">1</div>
  2.  
  3. <div id="menu">
  4.      <form action="dodaj" method="POST" style="style.css" class="formularz">
  5.             <input type="image" VALUE="pokaz" src="images/podstawowa2.gif">
  6.             <input type="image" VALUE="szukaj" src="images/podstawowa2.gif">
  7.            
  8.      </form>
  9.      </div>
  10.  
  11. <div id="menu2">
  12.      <form action="dodaj" method="POST" style="style.css" class="formularz2">
  13.  
  14. <div>
  15.            <textarea name="dodaj" cols="50" rows="10"></textarea>
  16. </div>
  17.            <input type="image" VALUE="wyslij" src="images/dodaj.gif">
  18.      </form>
  19.  
  20. </div>      
  21.  
  22.  
  23.  
  24. </body></html>
[HTML] pobierz, plaintext


--------------------
"Oprócz tabel istnieje jeszcze jedna dalece ograniczająca struktura, składająca się z rzędów i komórek - więzienie. Dla projektantów nadszedł czas, aby sie uwolnić..." - Eric A. Meyer
Go to the top of the page
+Quote Post
Dandelion
post
Post #7





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

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

przy tym kodzie wogole znika textarea
Go to the top of the page
+Quote Post
ens0re
post
Post #8





Grupa: Zarejestrowani
Postów: 143
Pomógł: 0
Dołączył: 23.08.2005
Skąd: Warszawa

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

Dziwneeee... blink.gif Mam taki kod:
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head><title>Mój pierwszy layout</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
  6. <link rel="stylesheet" type="text/css" media="all" href="style.css">
  7. </head>
  8. <body>
  9. <div id="logo">1</div>
  10.  
  11. <div id="menu">
  12.     <form action="dodaj" method="POST" class="formularz">
  13.            <input type="image" VALUE="pokaz" src="images/podstawowa2.gif">
  14.            <input type="image" VALUE="szukaj" src="images/podstawowa2.gif">
  15.          
  16.     </form>
  17.     </div>
  18.  
  19. <div id="menu2">
  20.     <form action="dodaj" method="POST" class="formularz2">
  21.  
  22. <div>
  23.           <textarea name="dodaj" cols="50" rows="10"></textarea>
  24. </div>
  25.           <input type="image" VALUE="wyslij" src="images/dodaj.gif">
  26.     </form>
  27.  
  28. </div>      
  29.  
  30.  
  31.  
  32. </body></html>
[HTML] pobierz, plaintext

I style.css
[HTML] pobierz, plaintext 
  1. * { margin: 0; padding: 0; }
  2.  
  3. body {
  4. margin: 5px;
  5. padding: 5px;
  6. }
  7.  
  8.  
  9. div#logo {
  10. background-color: white;
  11. height: 100px;
  12. }
  13.  
  14. #menu {
  15. width : 100%;
  16. height: 50px;
  17. text-align : center;
  18. background-color : #e6e6e6;
  19. margin-bottom: 10px;
  20. }
  21.  
  22. div#menu2 {
  23.  
  24. }
[HTML] pobierz, plaintext


I pod tym szarym paskiem gdzie jest 'pokaz' i 'szukaj' wyswietla sie textarea..

Ten post edytował ens0re 15.04.2006, 21:59:12


--------------------
"Oprócz tabel istnieje jeszcze jedna dalece ograniczająca struktura, składająca się z rzędów i komórek - więzienie. Dla projektantów nadszedł czas, aby sie uwolnić..." - Eric A. Meyer
Go to the top of the page
+Quote Post
Dandelion
post
Post #9





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

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

ens0re dzieki za pomoc

posiedzialem troche przy dokumentacji css i znalazlem rozwiazanie oczywiscie banalne

zamieniamy

Kod
div#menu2 {

}


na

Kod
#menu2 {
margin-top: 15px;
text-align : center;
}


cala sprawe rozwiazuje margin-top czyli margines gorny :]

dalej jednak nie moge znalezc rozwiazania jak wstawic w button typu submit lub reset pliku graficznego

jedyny pomysl jaki mialem to np

<button type"submit"><img src="sciezka"></button>

jednak nie wiem jak ustawic szerokosc i wysokosc przycisku zeby byl identyczny jak obrazka
Go to the top of the page
+Quote Post
ens0re
post
Post #10





Grupa: Zarejestrowani
Postów: 143
Pomógł: 0
Dołączył: 23.08.2005
Skąd: Warszawa

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

[HTML] pobierz, plaintext 
  1. background: url('tlo.png');
[HTML] pobierz, plaintext

?


--------------------
"Oprócz tabel istnieje jeszcze jedna dalece ograniczająca struktura, składająca się z rzędów i komórek - więzienie. Dla projektantów nadszedł czas, aby sie uwolnić..." - Eric A. Meyer
Go to the top of the page
+Quote Post
Dandelion
post
Post #11





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

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

sprawdzalem to na samym poczatku i nie dziala
Go to the top of the page
+Quote Post
ens0re
post
Post #12





Grupa: Zarejestrowani
Postów: 143
Pomógł: 0
Dołączył: 23.08.2005
Skąd: Warszawa

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

[HTML] pobierz, plaintext 
  1. <input type="submit" VALUE="wyslij">
[HTML] pobierz, plaintext

i style.css
[HTML] pobierz, plaintext 
  1. input {
  2. background-image: url('tlo.jpg');
  3. }
[HTML] pobierz, plaintext

I już masz dany obrazek jako tło submita. Musi działać smile.gif


--------------------
"Oprócz tabel istnieje jeszcze jedna dalece ograniczająca struktura, składająca się z rzędów i komórek - więzienie. Dla projektantów nadszedł czas, aby sie uwolnić..." - Eric A. Meyer
Go to the top of the page
+Quote Post
Dandelion
post
Post #13





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

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

zwracam honor musialem zle cos wczesnie probowac teraz dziala. Trzeba jeszcze ustawic border inputow na 0 wtedy przycik bedzie mial wymiary dokladnie jak obrazek
Go to the top of the page
+Quote Post
« Następny starszy · CSS · 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: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

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

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