Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS]CSS i Explorer
Forum PHP.pl > Forum > Przedszkole
ithat
7.02.2013, 10:49:47
Witam
mam problem z arkuszem stylów, otóż owa klasa jest bez problemowo wykrywana pod wszystkimi przeglądarkami, oprócz IE. W czym tkwi problem ?
oto kod
[CSS] pobierz, plaintext 
  1. table.all
  2. {
  3. text-align:center; margin-right: auto; margin-left:auto;
  4. }
[CSS] pobierz, plaintext

pozdrawiam
ithat
mstraczkowski
7.02.2013, 11:15:41
W twoim pytaniu jest zawarta odpowiedź.

Najprawdopodobniej problem leży w .... IE smile.gif
ithat
7.02.2013, 11:18:16
Heh ok, to może inaczej, czy ktoś wie jak to poprawić ?
pozdrawiam
ithat
adgad
7.02.2013, 12:11:17
Podpinam się do temat. Mam podobny problem. W szablonie dodałem takie coś:
Kod
        <!--[if IE]>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <!--[if IE 9]>
          <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
        <![endif]-->

No ale co jeszcze można zrobić? Osobne style dla IE?
ithat
7.02.2013, 14:50:15
Innego rozwiazanie nie znalazlem, tylko osobne style dla IE pomogly
pozdrawiam
ithat
adgad
7.02.2013, 21:48:58
Wrócę do tematu. W innych przeglądarkach niż IE 9 i wcześniejszych mam na start css:
Kod
margin: 0 auto;

no ale ja już nawet kolega wyżej napisał dla ie wymagane jest tworzenie osobnego arkusza, to margin nie działa, działa, np:
Kod
margin-left: 200px;

No ale jak będzie inna rozdzielczość to trochę źle to wygląda. Moje pytanie brzmi zatem: jak sobie z tym poradzić? Wykrywać rozdzielczość ekranu i na tej podstawie dla ie tworzyć odpowiedni margin? Czy jakoś inaczej?
Damonsson
7.02.2013, 21:52:01
Masz jakiś przykład online takiej strony?
adgad
8.02.2013, 09:19:33
Hmm, aktualnie nie. Ale mogę wrzucić na hosting, tylko że dopiero jutro, teraz z tela piszę.

Zgodnie z obietnicą, wstawiłem zarodek szablonu i pliki css na serwer testowy:
http://grzeznikiewicz.com.pl/
No i "jedyny" problem to przeglądarki starsze od IE10, tam nie działa margin: 0 auto.
muniekw
8.02.2013, 09:36:20
Czemu w stylach masz ustawiony 
[HTML] pobierz, plaintext 
  1. margin-left: 300px;
[HTML] pobierz, plaintext
?

Jeśli chcesz wyśrodkować stronę bo domyślam się, że o to Ci chodzi to zerknij sobie np tu: Wyśrodkowanie strony

Jest sporo tego typu poradników, więc bez problemu coś wyszukasz. wink.gif

Zawsze możesz dołączyć jeszcze style resetujące znaczniki: Style
adgad
8.02.2013, 09:49:14
Cytat(muniekw @ 8.02.2013, 09:36:20 ) *
Czemu w stylach masz ustawiony 
[HTML] pobierz, plaintext 
  1. margin-left: 300px;
[HTML] pobierz, plaintext
?

Jeśli chcesz wyśrodkować stronę bo domyślam się, że o to Ci chodzi to zerknij sobie np tu: Wyśrodkowanie strony

Jest sporo tego typu poradników, więc bez problemu coś wyszukasz. wink.gif

Zawsze możesz dołączyć jeszcze style resetujące znaczniki: Style

Czemu?: chciałem pokazać dla przykładu że tylko tak mogę odsunąć treść.
Przykład z linku nie działa. Dałem nawet już w div ten contener i nadal nic. Zanim tu napisałem to oczywiście szukałem. Szukałem też na tym forum. Jeśli znasz link do artykułu który na pewno działa to będę wdzięczny. No chyba że coś robię źle.
Co do klasy reset-w projekcie ona istnieje-jednak wyświetla tak samo z reset i bez niego, więc wrzucając pominąłem ten plik.
muniekw
8.02.2013, 10:07:18
Napisane na szybko:

styles.css
[HTML] pobierz, plaintext 
  1. @CHARSET "UTF-8";
  2.  
  3. * {margin:0; padding:0;}
  4. #container {
  5. 	margin: 0 auto;
  6. 	width: 750px;
  7. 	height: auto;
  8. 	border: 1px red solid;
  9. }
[HTML] pobierz, plaintext


index.html
[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=utf-8">
  5. 	<title>Test</title>
  6.  
  7. 	<link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
  8.  
  9. </head>
  10. <body>
  11. 	<div id="container">
  12. 		Jakiś tekst.
  13.     </div>
  14. </body>
  15. </html>
[HTML] pobierz, plaintext


Sprawdź czy działa. Ewentualnie sobie przerób.
!*!
8.02.2013, 11:54:20
Prawdopodobnie nadpisujesz style css w innych plikach. http://jsfiddle.net/jTjYx/
adgad
8.02.2013, 21:16:10
Cytat(!*! @ 8.02.2013, 11:54:20 ) *
Prawdopodobnie nadpisujesz style css w innych plikach. http://jsfiddle.net/jTjYx/

Fakt, w kontrolerze wczytywałem jeszcze raz plik style.css który jest w layoucie. Kod od @muniekw też wstępnie działa, więcej napiszę jak porządnie przetestuje, bo na serwerze mam komunikat że nie można połączyć z bazą a za chwilę jest ok.

Hmm, nie wiem co sądzić. Jak patrzyłem wcześniej na komputerze z windows7 -> ie9 to działało, teraz na moim komputerze z win8 nie działa. Mógłby ktoś sprawdzić pod adresem który podałem? Ja używam ie testera, gdyż mam ie10, w którym wszystko działa jak należy, a w ie testerze nie działa z kolei.
Kod @!*! działa mi w ie testerze, przekształciłem na taki:
[HTML] pobierz, plaintext 
  1. <DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="UTF-8" />
  5.         <link type="text/css" rel="stylesheet" href="application/themes/myTheme/views/layouts/css/style.css" />
  6.         <link type="text/css" rel="stylesheet" href="application/assets/css/reset.css" />
  7.         <script type="text/javascript" src="application/assets/js/jquery.js"></script>
  8.         <!--[if IE]>
  9.           <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  10.         <![endif]-->
  11.         <!--[if IE 9]>
  12.           <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
  13.         <![endif]-->
  14.  
  15.         <title>Programowanie w php</title>
  16.     </head>
  17.     <body>
  18.         <section class="all">
  19.             test 
  20.         </section><!--end contener-->
  21.     </body>
  22. </html>
[HTML] pobierz, plaintext

a css:
Kod
.all{margin:0 auto;text-align:center;width:100px;border:1px solid red}

No i w trybie zgodności nie działa ;/
Damonsson
9.02.2013, 00:26:21
Dodaję text-align: center dla body na http://grzeznikiewicz.com.pl/ i działa nawet pod IE7, więc w czym problem? Margin auto też jakoś da się zrobić, ale nie pamiętam.
!*!
9.02.2013, 11:05:32
1. nie korzystaj z zewnętrznych programów jak jakieś śmieszne testery zgodności, bo potrafią być błędy w renderowaniu.
2. jak już musisz testować sam wygląd to dobrym rozwiązaniem wydają się serwisy podobne do browsershots.org lub browserlab.adobe.com
3. plik reset.css MUSI być pierwszy w szablonie, a nie drugi.
4. wywal te skrypty js na początek przed css, lub wywal wszytko i sprawdzaj po kolei, a znajdziesz przyczynę.
5. skorzystaj z jakiś narzędzi np. dragonfly w operze, lub narzędzia developera w chrome, może wyświetlą coś co jest kolizyjne.
adgad
11.02.2013, 20:44:59
Cytat(Damonsson @ 9.02.2013, 00:26:21 ) *
Dodaję text-align: center dla body na http://grzeznikiewicz.com.pl/ i działa nawet pod IE7, więc w czym problem? Margin auto też jakoś da się zrobić, ale nie pamiętam.

W tym że najwyraźniej źle to robiłem, teraz na spokojnie jeszcze raz zrobiłem dla body text-align i jest ok. Co ciekawe to załatwia całą sprawę.
Cytat(!*! @ 9.02.2013, 11:05:32 ) *
1. nie korzystaj z zewnętrznych programów jak jakieś śmieszne testery zgodności, bo potrafią być błędy w renderowaniu.

Wiem że potrafią być, ale do Twojego postu nie wiedziałem o innych sposobach
Cytat(!*! @ 9.02.2013, 11:05:32 ) *
2. jak już musisz testować sam wygląd to dobrym rozwiązaniem wydają się serwisy podobne do browsershots.org lub browserlab.adobe.com

Rzeczywiście, to dużo lepsze rozwiązanie.
Cytat(!*! @ 9.02.2013, 11:05:32 ) *
3. plik reset.css MUSI być pierwszy w szablonie, a nie drugi.
4. wywal te skrypty js na początek przed css, lub wywal wszytko i sprawdzaj po kolei, a znajdziesz przyczynę.

Ok, przyjąłem. Przyczyna chyba znaleziona: brak tex-align w body. Bez tego nie umiem zrobić. Może kiedyś się natknę na lepszy sposób.
Cytat(!*! @ 9.02.2013, 11:05:32 ) *
5. skorzystaj z jakiś narzędzi np. dragonfly w operze, lub narzędzia developera w chrome, może wyświetlą coś co jest kolizyjne.

Korzystam z firebuga w firefox - najlepiej mi się w nim pracuje smile.gif
Dzięki za pomoc.
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.