Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [CSS]Problem z menu po Firefoxem, Menu wyświetla się w IE a z firefoxie nie
romarta
post 9.07.2009, 07:56:26
Post #1





Grupa: Zarejestrowani
Postów: 40
Pomógł: 0
Dołączył: 20.01.2009

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

Zrobiłam sobie proste menu obrazkowe i problem jest taki że w Firefoxie i Chromie mi nie wyświetla sie a po IE działa idealnie.
Menu zrobione jest z wykorzystaniem css, ponieważ po najechaniu na daną kategorię ma się ona podświetlić a po kliknięciu na nią zmienić. I nie wiem w czym jest problem.
Oto kod menu:
[HTML] pobierz, plaintext 
  1. <tr>
  2.         <td>
  3.            <div class="mix_06"><a href="firma.html"> <!--    <img src="images/metal_mix_06.jpg" width="199" height="62" border="0" alt="">--></a></div></td>
  4.         <td>
  5.           <div class="mix_07"><a href="katalog.html"> <!--<img src="images/metal_mix_07.jpg" border="0" width="201" height="62" alt="">--></a></div></td>
  6.         <td colspan="3">
  7.                  <div class="mix_08"><a href="kontakt.php"> <!--    <img src="images/metal_mix_08.jpg" width="201" height="62" border="0" alt="">--></a></div></td>
  8.         <td>
  9.              <img src="images/metal_mix_09.jpg" width="14" height="62" alt=""></td>
  10.     </tr>
[HTML] pobierz, plaintext


a to formatowanie w CSS:
Kod
.mix_06 a:link{
background-image:url(images/metal_mix_06.jpg);
height:62px;
width:199px;
}
.mix_06 a:visited{
background-image:url(images/metal_mix_06.jpg);
height:62px;
width:199px;
}
.mix_06 a:hover{
background-image:url(images/metal_mix_06a.jpg);
height:62px;
border:none;
}
.mix_06 a:active{
background-image:url(images/metal_mix_06a.jpg);
height:62px;
width:199px;
border:none;
}
.mix_07 a:link{
background-image:url(images/metal_mix_07.jpg);
height:62px;
width:201px;
}
.mix_07 a:visited{
background-image:url(images/metal_mix_07.jpg);
height:62px;
width:201px;
}
.mix_07 a:hover{
background-image:url(images/metal_mix_07a.jpg);
height:62px;
width:201px;
}
.mix_07 a:active{
background-image:url(images/metal_mix_07a.jpg);
height:62px;
width:201px;
}
.mix_08 a:link{
background-image:url(images/metal_mix_08.jpg);
height:62px;
width:201px;
}
.mix_08 a:visited{
background-image:url(images/metal_mix_08.jpg);
height:62px;
width:201px;
}
.mix_08 a:hover{
background-image:url(images/metal_mix_08a.jpg);
height:62px;
width:201px;
}
.mix_08 a:active{
background-image:url(images/metal_mix_08a.jpg);
height:62px;
width:201px;
}
Go to the top of the page
+Quote Post
muniekw
post 9.07.2009, 08:22:47
Post #2





Grupa: Zarejestrowani
Postów: 243
Pomógł: 22
Dołączył: 1.06.2009
Skąd: Warszawa

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

A czemu jak masz np
Kod
<img src="images/metal_mix_06.jpg" width="199" height="62" border="0" alt="">

to umieszczasz to w komentarzu??
Go to the top of the page
+Quote Post
Darti
post 9.07.2009, 08:25:14
Post #3





Grupa: Zarejestrowani
Postów: 1 076
Pomógł: 62
Dołączył: 6.03.2005
Skąd: Wroc

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

a określiłas szerokość tabelki, w której całe menu sie znajduje ?


--------------------
The answer is out there, Neo. It's looking for you. And it will find you, if you want it to.
SERVER_SOFTWARE : Apache/2.2.4 (Win32) PHP/5.2.1
MySQL Client API version : 5.0.27
Go to the top of the page
+Quote Post
romarta
post 9.07.2009, 08:42:24
Post #4





Grupa: Zarejestrowani
Postów: 40
Pomógł: 0
Dołączył: 20.01.2009

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

na poczatku to menu było za pomoca tabelki i ten obrazek co jest w komentarzu to jest to co ma być w menu, ale potem się koncepcja zmieniła że ma się ten obrazek zmieniać jak sie na jedzie na menu i po klikniecu w daną kategorię, więc zrobiłam to css a tamto sobie dałam w komentarz tymczasowo jak mi będzie już wszytko działać to wykasuje.
bo to menu to tylko obrazek bez tekstu pisanego. Jeżeli bym zostawiła ten obrazek w tej tabeli to wtedy by mi podmiana nie działa

określiłam szerokości
Go to the top of the page
+Quote Post
pawelpaciorek
post 9.07.2009, 10:10:52
Post #5





Grupa: Zarejestrowani
Postów: 13
Pomógł: 2
Dołączył: 8.07.2009

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

wydaje mi się, że zanim określisz szerokość, wysokość i background dla znacznika <a> to musisz mu najpierw ustawić

Kod
display: block


--------------------
Pozdrawiam
Paweł Paciorek | Creative - tworzenie stron www
Go to the top of the page
+Quote Post
l0ud
post 9.07.2009, 10:17:17
Post #6





Grupa: Zarejestrowani
Postów: 1 387
Pomógł: 273
Dołączył: 18.02.2008

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

Cytat
wydaje mi się, że zanim określisz szerokość, wysokość i background dla znacznika <a> to musisz mu najpierw ustawić


Dodam jeszcze, że jeżeli w IE wyświetla się poprawnie, prawdopodobnie nie ustawiłeś poprawnego doctype. Ustaw takie, aby nie przełączać przeglądarki w quirks mode smile.gif


--------------------
XMPP: l0ud@chrome.pl
Go to the top of the page
+Quote Post
romarta
post 9.07.2009, 10:38:25
Post #7





Grupa: Zarejestrowani
Postów: 40
Pomógł: 0
Dołączył: 20.01.2009

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

mam takie ustwienie: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> ?
Go to the top of the page
+Quote Post
l0ud
post 9.07.2009, 10:57:48
Post #8





Grupa: Zarejestrowani
Postów: 1 387
Pomógł: 273
Dołączył: 18.02.2008

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

Zmień na to:
Kod
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


I zastosuj się do rady kolegi winksmiley.jpg


--------------------
XMPP: l0ud@chrome.pl
Go to the top of the page
+Quote Post
romarta
post 9.07.2009, 11:40:13
Post #9





Grupa: Zarejestrowani
Postów: 40
Pomógł: 0
Dołączył: 20.01.2009

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

zmieniłam !DOCTYPE i teraz wogóle nie działa, a gdzi eten dispaly mam dokładnie dodać?

zadziałało, troche mi się strona rozjechała ale działa smile.gif dzięki smile.gif
Go to the top of the page
+Quote Post
pawelpaciorek
post 9.07.2009, 11:44:58
Post #10





Grupa: Zarejestrowani
Postów: 13
Pomógł: 2
Dołączył: 8.07.2009

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

Kod
.mix_06 a {
display: block;
background-image:url(images/metal_mix_06.jpg);
height:62px;
width:199px;
float: left; //jesli menu ma być w układzie poziomym
}


.mix_06 a:hover {
display: block;
background-image:url(images/metal_mix_06a.jpg);
height:62px;
width:199px;
float: left; //jesli menu ma być w układzie poziomym
}


--------------------
Pozdrawiam
Paweł Paciorek | Creative - tworzenie stron www
Go to the top of the page
+Quote Post
viking
post 9.07.2009, 11:50:36
Post #11





Grupa: Zarejestrowani
Postów: 6 378
Pomógł: 1116
Dołączył: 30.08.2006

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

Jeśli już to:
Kod
.mix_06 a {
background-image:url(images/metal_mix_06.jpg);
height:62px;
width:199px;
float: left; //float wymusza display: block
}

.mix_06 a:hover,
.mix_06 a:focus {
background-image:url(images/metal_mix_06a.jpg);
}


Dbamy o transfer użytkownika.

edit: A swoją drogą to czemu nie zrobić tego porządnie na ul li a (w html5 jeśliby korzystać jest element nav) tylko divy wewnątrz tabel?

Ten post edytował viking 9.07.2009, 12:05:00


--------------------
Odpowiedzi na często zadawane pytania:
Konfiguracja serwera Apache + PHP 7 pod Windows | Kodowanie znaków na stronach www | PHPTAL w Zend Framework | Programowanie obiektowe w PHP | PDO uniwersalnym sposobem na obsługę baz danych | Kurs PHP (część 1): Podstawowy opis języka
Go to the top of the page
+Quote Post
romarta
post 9.07.2009, 13:51:02
Post #12





Grupa: Zarejestrowani
Postów: 40
Pomógł: 0
Dołączył: 20.01.2009

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

Bardzo dziękuję wszystkim za pomoc. Teraz strona jest ok.
Co do tych tabel, niestety taki otrzymałam szablon sad.gif i miałam go skończyć. Gdybym robiła to od podstaw sama zrobiłabym inaczej ale cóż.
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 Wersja Lo-Fi Aktualny czas: 20.07.2025 - 06:12
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn