PDA

Zobacz pełną wersję : Zaokrąglone rogi w internet explorer 8



grzesiek2
25-09-2013, 14:15
Witam jaki jest prosty sposób na to aby szablon pod przeglądarką explorer miał zaokrąglone rogi? Pod zwykłą stronką próbowałem border-radius.htc, i działa ale pod joomla 3.0 już nie, jeżeli ktoś rozwiązał ten problem a podzielił by się informacją byłbym wdzięczny, a wiem że sie da ponieważ nowa strona joomla.pl pod explorer ma zaokrąglone narożniki, z góry dzięki za wszelkie info.

Tor_
25-09-2013, 15:06
A czym się różni css na zwykłej stronie od tego który jest używany w szablonie joomla .Zadziała ale w IE 9 :) Link (http://msdn.microsoft.com/en-us/library/ie/jj127319%28v=vs.85%29.aspx)
Mimo wszystko popróbuj


-webkit-border-radius: 7.5em 5em; /* Safari & Chrome */
-moz-border-radius: 7.5em 5em; /* Firefox */
-ms-border-radius: 7.5em 5em; /* Internet Explorer */
-o-border-radius: 7.5em 5em; /* Opera */
border-radius: 7.5em 5em; /* W3C */

Zerknij tutaj LINK1 (http://css3pie.com/) LINK2 (http://fetchak.com/ie-css3/)

KES
25-09-2013, 15:09
to co @Tor_ podał również nie zadziała w ie8 (lecz zawsze mogę się mylić :)). Poczytaj o css3pie.

grzesiek2
25-09-2013, 15:29
KES a czy używałeś css3pie w joomla? jeżli tak to jak udało ci się osiągnąć zamierzony efekt? co do postu Tor_ pobrałem plik z strony http://fetchak.com/ie-css3/ wysłałem na serwer do głównego katalogu strony public_html a w stylach umiesciłem (poniżej) i nic to nie dało.
#cennik a {

behavior: url(ie-css3.htc);
position: relative;

color: #FFFFFF;
padding-top: 1px;
padding-bottom: 1px;
text-align: center;
width: 68px;
text-decoration: none;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-khtml-border-radius: 5px;
-ms-border-radius: 7.5em 5em;
display: block;
float: right;
display: inline;

box-shadow: 2px 2px 3px #000;

filter: progid:DXImageTransform.Microsoft.gradient(Gradien tType=0, startColorstr='#fa713f', endColorstr='#eb3f00');

KES
25-09-2013, 16:07
Ściągnij plik ze strony producenta PIE (http://css3pie.com/).
Masz również tam przykład jak używać PIE oraz behavior powinien być na końcu bloku stylu.

W przykładzie PIE wyłącz box-shadow, linear-gradient i zaznacz Show CSS.

grzesiek2
25-09-2013, 16:52
Dzięki KES za info zrobiłem jak napisałeś tzn pobrałem plik PIE (http://css3pie.com/) wypakowałem i 5 plików z paczki wrzuciłem do folderu o nazwie pie. Folder ten wgrałem do głównego katalogu public_html a ścieżka w css jest taka

#przyklad {
color: #FFFFFF;
height: 34px;
padding-left: 100px;
padding-top: 16px;
width: 165px;
border: 1px solid #696;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background: #EEFF99;
behavior: url(pie/PIE.htc);
}

Niestety explorer wyświetla nadal bez zaokrąglonych rogów KES chociaż nie rozwiązałem mojego problemu daje ci punkt za pomoc jeżeli masz jakiś pomysł lub co źle zrobiłem odpisz dzieki

KES
25-09-2013, 17:58
Hmm.. zmień:

behavior: url(pie/PIE.htc);
na:

behavior: url(/pie/PIE.htc);
lub:

behavior: url(./pie/PIE.htc);

alex51
25-09-2013, 18:40
Można dodać odpowiedni wpis do pliku index.php. we fragmencie części head definiującym osadzenie stylów css, gdzie trzeba, tak jak w niżej podanym przykładowym kodzie wstawić nazwy wszystkich klas i identyfikatorów zawierających reguły radius:

<?php if ($this->params->get('usecsspie','1')) { ?><!--[if lte IE 8]>
<style type="text/css">
.pagenav a,.readmore a,.button,#topmod2 > div.inner { behavior: url(<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/pie.htc) }
</style>
<![endif]--><?php } ?>
Oprócz powyższego w katalogu szablonu należy umieścić plik pie.htc, którego zawartość jest dostępna w linku podanym przez @KES'a (http://css3pie.com/download/).

zwiastun
25-09-2013, 19:50
I najlepiej umieścić adres bezwzględny