Forum PHP.pl > Moja strona wygląda zupełnie inaczej w IE, FF I Operze, Pomocy

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: Moja strona wygląda zupełnie inaczej w IE, FF I Operze, Pomocy

Forum PHP.pl > Forum > Po stronie przeglądarki

akurczyk

1.08.2008, 10:42:13

Moja strona wygląda inaczej w każdej przeglądarce.
Wiem że to normalne, ale strona prawidłowo wygląda tylko w FF.

Adres: http://kklodzka.pdg.pl/

IE:
1. Niebieskie obramowanie obrazów!
W stylach jest zdefiniowany kolor pomarańczowy.
2. Rozjeżdżanie napisów w bocznym panelu (tylko H2)!
Można minimalnie zamiejscowy rozmiar H2 ale ten rozmiar nie jest zdefiniowany w stylach.
Więc jaki to rozmiar?

FF Wszystko OK!

Opera:
1. Brak obramowania obrazów!
W stylach jest zdefiniowane obramowanie!

Proszę o pomoc!

Gordon1x

1.08.2008, 12:20:37

1. Obramowanie obrazków

W pliku style.css wpisz i zobacz czy działa:

[HTML] pobierz, plaintext 
img {
	border-top:solid 1px #000000;
	border-left:solid 1px #000000;
	border-right:solid 1px #000000;
	border-bottom:solid 1px #000000;
}
 
// zamiast #000000 wpisz swój kolor
[HTML] pobierz, plaintext

Lub zastosuj drugi sposób (trochę dziwny może, ale za to działa).

[HTML] pobierz, plaintext 
.img_obramowanie {
	border-top:solid 1px #000000;
	border-left:solid 1px #000000;
	border-right:solid 1px #000000;
	border-bottom:solid 1px #000000;
}
 
// zamiast #000000 wpisz swój kolor
[HTML] pobierz, plaintext

A w znaczniku img wpisz:

[HTML] pobierz, plaintext 
<img src="adres/obrazka.jpg" border="0" class="img_obramowanie">
[HTML] pobierz, plaintext

P.S.
Napisz czy zadziałało.

zuvik

1.08.2008, 12:21:54

Jeżeli chodzi o H2 to musisz w stylach zdefiniować jego rozmiar.

JoShiMa

1.08.2008, 12:27:41

Zamiast:

[HTML] pobierz, plaintext 
img {
border-top:solid 1px #000000;
border-left:solid 1px #000000;
border-right:solid 1px #000000;
border-bottom:solid 1px #000000;
}
[HTML] pobierz, plaintext

Wystarczy:

[HTML] pobierz, plaintext 
img {
border:solid 1px #000000;
}
[HTML] pobierz, plaintext

Co za kaszanka:

[HTML] pobierz, plaintext 
<img src="adres/obrazka.jpg" border="0" class="img_obramowanie">
[HTML] pobierz, plaintext

Po co używać atrybutu border w znaczniki img skoro używa się klas? Nie ucz ludzi tak kodować.

Gordon1x

1.08.2008, 12:59:40

Cytat(JoShiMa @ 1.08.2008, 13:27:41 )

Co za kaszanka:

[HTML] pobierz, plaintext 
<img src="adres/obrazka.jpg" border="0" class="img_obramowanie">
[HTML] pobierz, plaintext

Po co używać atrybutu border w znaczniki img skoro używa się klas? Nie ucz ludzi tak kodować.

Tak masz rację to nie jest porawne rozwiązanie.
----------------------------------------

[HTML] pobierz, plaintext 
img {
border:solid 1px #000000;
}
[HTML] pobierz, plaintext

Kiedyś się spotkałem, że w jakiejś przeglądarce (nie pamiętam nazwy i wersji) to nie działało, ale ten kod już działał:

[HTML] pobierz, plaintext 
border-top:solid 1px #000000;
	border-left:solid 1px #000000;
	border-right:solid 1px #000000;
	border-bottom:solid 1px #000000;
[HTML] pobierz, plaintext

Dlatego wydaje mi się, że to rozwiązanie jest pewniejsze.
Proszę tylko pamiętać ,że to jest moje zdanie.

wojckr

1.08.2008, 13:09:03

Widać, że Twoja strona jest jeszcze niewielka. Przygotuj się na więcej takich przypadków.

Jeśli twoje obrazki są linkami to jest też inne rozwiązanie:

[HTML] pobierz, plaintext 
<a href="b.jpg" class="link_obrazek"><img src="bmin.jpg" alt="b" /></a>
[HTML] pobierz, plaintext

i w stylach:

[HTML] pobierz, plaintext 
a.link_obrazek img {border:2px solid orange;}
[HTML] pobierz, plaintext

Albo zwięźlej:

[HTML] pobierz, plaintext 
<div class="obrazki">
<a href=""><img src="" alt="" /></a>
<a href=""><img src="" alt="" /></a>
<a href=""><img src="" alt=""/></a>
</div>
[HTML] pobierz, plaintext

i w stylach:

[HTML] pobierz, plaintext 
div.obrazki a img {border:...;}
[HTML] pobierz, plaintext

akurczyk

1.08.2008, 19:19:07

ok
a co do h2 to jaki on ma standardowo rozmiar żebym mógł dać mniejszy?

paziek

1.08.2008, 23:16:46

Nie ma żadnego standardu, który definiowałby rozmiar czcionki dla nagłówków.
Popróbuj kilka i zostaw taki, który najlepiej pasuje dla strony.

akurczyk

2.08.2008, 09:17:22

ale w stylach rozmiar h2 ani h1 nie jest zdefiniowany, co powinienem tam wpisać?

paziek

2.08.2008, 14:46:07

nie wiem..
h1 {
font-size: 21px;
}
h2 {
font-size: 16px;
}
może? Pozmieniaj sobie te wartości aby odpowiednio dopasować do strony. Możesz też popróbować z margin: oraz padding:, bo kto wie, czy tu też przeglądarki nie używają/zaczną_używać różnych wartości.

JoShiMa

4.08.2008, 09:32:20

Cytat(paziek @ 2.08.2008, 00:16:46 )

Nie ma żadnego standardu, który definiowałby rozmiar czcionki dla nagłówków.
Popróbuj kilka i zostaw taki, który najlepiej pasuje dla strony.

Nie zupełnie. Każda przeglądarka ma domyślny rozmiar dla elementów <hx>.

Cytat(akurczyk @ 2.08.2008, 10:17:22 )

ale w stylach rozmiar h2 ani h1 nie jest zdefiniowany, co powinienem tam wpisać?

To co Ci będzie pasować do wyglądu strony.

.radex

6.08.2008, 10:35:28

Jeśli coś z niewiadomych przyczyn nie chce działać, można spróbować dodać !important na końcu, np. zamiast

img {
border:solid 1px #000000;
}

to:

img {
border:solid 1px #000000 !important;
}

Różne style mogą ze sobą kolidować, ale !important często pomaga. Natomiast należy pamiętać, że jeśli wszystko jest !important, to nic nie jest !important

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.