Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS] pozycjonowanie problem
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
robert-0627
30.03.2008, 21:43:43
Witam ten problem mam już od dłuższego czasu i nie mogę sie z nim uporać . Ustawiam sobie div wszystko pięknie ładnie ale w operze tak jest . Natomiast kiedy przechodze do moziili ostepy się pomniejszaja przez co nachodzi na siebie . Jakiego pozycjonowania mam użyć i jakich mniej więcej parametrów aby wszystko było takie same w każdej przeglądarce ? Lub jeśli ktoś może dac jakiś link do dobrego kursu z tymi divami smile.gif
Crozin
30.03.2008, 22:37:38
Pokaż kod/daj linka do strony bo nie bardzo rozumiem o co Ci chodzi.

Może wyzerowanie wszystkich domyślnych marginesów pomoże?
Kod
html, body, h1, h2, h3, h4, h5, h6, div, span, blockquote, p, address, form,
fieldset, img, ul, ol, dl, dt, dd, li, hr, table, td, th, strong, em, sup, sub,
dfn, ins, del, q, cite, var, samp, code, kbd, tt{
  margin: 0;
  padding: 0;
  border: 0;
}
robert-0627
31.03.2008, 08:20:37
Te róznice w przeglądarkach już naprawiłem jendak teraz mam problem z colorami.

Daje color container green jednak na stronie nic się nie stało ? Co zrobiłem nie tak ?

[HTML] pobierz, plaintext 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="content-type" content="text/html; charset=iso-8859-2">
  5. <title>INDEX</title>
  6. <meta>
  7.  
  8. <style type="text/css">
  9. /* <![CDATA[ */
  10.                #lewa { background-color: black ;
  11.                 position: absolute; 
  12. 		margin-top: 20px; 
  13. 		margin-left: 50px }
  14.  
  15. 		#prawa { background-color: black ;
  16.                 position: absolute;
  17. 		margin-top: 20px; 
  18. 		margin-left: 450px }
  19.  
  20.                 #container {
  21.                 margin:0 auto;
  22.                 padding:0 5px 0 5px;
  23.                 position:relative;
  24.                 width:750px;
  25.                 background-color: green ;
  26.                 text-align:left;
  27.                 clear: both;
  28.     }
  29.  
  30.  
  31. 		#srodek { background-color: black ;
  32.                 position: absolute;
  33. 		margin-top: 20px; 
  34. 		margin-left: 250px }
  35. (...)
  36. /* ]]> */
  37. </style>
  38. </head>
  39. <body bgcolor="#FF0000" text="#FFFFFF" link="#00FF00" alink="#FF00FF" vlink="#00FFFF">
  40.  
  41. <div id="container">
  42.  
  43. <div id="lewa" style="border: solid green 3px">
  44. <h1>HEHEHEHE</h1>
  45.  
  46. </div>
  47. <div id="prawa" style="border: solid green 3px">
  48. <h1>HEHEHEHE</h1>
  49. </div>
  50. <div id="srodek" style="border: solid green 3px">
  51. <h1>HEHEHEHE</h1>
  52. </div>
  53. </div>
  54. </body>
  55. </html>
[HTML] pobierz, plaintext
Crozin
31.03.2008, 18:32:18
Zamiast nazw słownych lepiej użyć zapisu szesnastkowego - kolor zielony to: #0000FF (lub w skrócie: #00F)
fjellah
31.03.2008, 19:05:48
...postanowiłem wpaść. Crozin, zapis 
[HTML] pobierz, plaintext 
  1. html, body, h1, h2, h3, h4, h5, h6, div, span, blockquote, p, address, form, 
  2. fieldset, img, ul, ol, dl, dt, dd, li, hr, table, td, th, strong, em, sup, sub, 
  3. dfn, ins, del, q, cite, var, samp, code, kbd, tt{
  4.   margin: 0;
  5.   padding: 0;
  6.   border: 0;
  7. }
[HTML] pobierz, plaintext
==
[HTML] pobierz, plaintext 
  1. * {
  2.   margin: 0;
  3.   padding: 0;
  4.   border: 0;
  5. }
[HTML] pobierz, plaintext
(nie wymieniłeś wszystkich elementów, ale prawie:)). Co do tematu posta... nie warto szeregować elementów strony "absolutnie". Lepiej można to zrobić za pomocą właściwości float. Przykładowo, gdy chcesz dać jakiegoś diva na prawo, dajesz 
[HTML] pobierz, plaintext 
  1. div {float:right;}
[HTML] pobierz, plaintext
Gdy chcesz go umieścić pośrodku stronu(tak jak div container, jak mniemam), powinieneś dla tego diva dać właściwość 
[HTML] pobierz, plaintext 
  1. margin:0 auto;
[HTML] pobierz, plaintext
Jak masz jakieś pytania na temat xhtmla/css, wal na pw. Pozdrawiam.
Crozin
31.03.2008, 19:20:50
@fjellah masz rację... ten zapis kopiuję/wklejam już od ponad roku (chyba... może więcej)
Gdzieś, kiedyś, coś wyczytałem, że lepiej stosować taki zapis niż gwiazdkę - ale obecnie nie jestem w stanie nawet powiedzieć czy to prawda smile.gif
fjellah
31.03.2008, 19:36:11
Nie ma takiej opcji, żeby gwiazdka nie zadziałała czy żeby było w jej stosowaniu coś niepewnego...Jeszcze się nie spotkałem z przypadkiem, by zawiodła. Naprawdę smile.gif Pozdrawiam.
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.