|
Pozycjonowanie w CSS w dodatkowej stronie
|
| milosz1245 |
Dodany dnia 06.10.2011 20:16:38
|
Przedszkolak
Postów: 11
Ostrzeżeń: 1
Data rejestracji: 16.08.2010 22:34
|
Witam!
Ostatnio męczę się z pozycjonowaniem na mojej stronie (www.nickfan.jcom.pl), otóż po stworzeniu stylu w CSS poprawnie wyświetla się na Mozilla Firefox i na Opera ale już na Google Chrome nie. Oto screeny:
Poprawnie wyświetlany:
http://fotoo.pl/h...x.png.html
Błędnie wyświetlany (Google Chrome):
http://fotoo.pl/h...e.png.html
Oto kod mojej dodatkowej strony:
<head>
<style type="text/css">
a#button {
float: left;
height:24px;
background:url(http://www.nickfan.jcom.pl/images/articles/icarlym.png) no-repeat;
width:110px;
background-position: 0 0;
font:12px Tahoma, Arial, Helvetica, sans-serif;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:5px 0 0 0;
text-align:center;
}
a#button:hover {
background-position:0 -29px;
color:#fff;
}
</style>
</head>
<span>
<center><table background="http://www.nick.com/nick-assets/shows/images/icarly/themes/th_icarly_bg.jpg" width="100%" height="100%"><tr>
<td><h1 align="right">
<center><a href='http://www.nickfan.jcom.pl/infusions/twb_shopping_cart/index.php' ><img src='http://www.nickfan.jcom.pl/images/articles/reklama728x90.jpg' /></a><br /><br /></center>
<img src='http://www.nickfan.jcom.pl/images/articles/icarlyl.png' /></a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=9" id="button">Strona Główna</a>
<a href="#" id="button">O serialu</a>
<a href="#" id="button">Odcinki</a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=33" id="button">Gry online</a>
<a href="http://www.nickfan.jcom.pl/forum/viewforum.php?forum_id=38" id="button">Forum</a>
<a href="http://www.nickfan.jcom.pl/photogallery.php?album_id=1" id="button">Galeria</a>
<a href="http://www.nickpedia.jcom.pl/index.php/ICarly" id="button">Nickpedia</a>
<a href="#" id="button">Do pobrania</a>
<a href="http://www.nickfan.jcom.pl/infusions/fusionboard4/usercp.php?section=groups&view=1" id="button">Oficjalna grupa</a></span><br />
<span>
<div><p style="position: absolute; z-index: 1; right: 1.3%; top: 514px; display: inline; display: run-in"><script type="text/javascript" src="http://www.wrzuta.pl/embed_video.js?key=3cxrkD8qHBl&login=nickpolska&width=265&height=202&bg=ffffff"></script></p></div>
<div><img style="width: 100%; height: 261; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/tlo1.png"/></div>
<div><img style="position: absolute; z-index: 2; right: 35%; top: 539px; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/icarly-large-marge.jpg" alt="..." /></div>
</span>
<span class='small2'>Wszelkie prawa zastrzeżone!</span> © <span class='small2'><?php echo date('Y', filemtime($_SERVER['SCRIPT_FILENAME'])); ?> Viacom International Inc. All Rights Reserved</span>
Pytanie brzmi co jest źle a coś musi być skoro nie działa prawidłowo, i jak to naprawić? Z góry dziękuje za pomoc :).
PW od moderatora:
- Przeniesienie tematu - Pieka 06.10.2011 22:36
Edytowane przez milosz1245 dnia 06.10.2011 20:23:39
|
| |
|
|
| Wścibski Gość |
Dodany dnia 25.11.2024 10:40:06
|
Pan Kontekstualny
Postów: n^x
Data rejestracji: Zawsze
|
|
| IP: localhost |
|
|
| jantom |
Dodany dnia 06.10.2011 21:30:21
|
Weteran
Postów: 3460
Pomógł: 123
Data rejestracji: 31.03.2005 20:10
|
Nie jest szczęśliwym pomysłem pakowanie drugiej sekcji head w body... Pomijam resztę bur... bajzlu w kodzie.
Wywal:
<head>
<style type="text/css">
a#button {
float: left;
height:24px;
background:url(http://www.nickfan.jcom.pl/images/articles/icarlym.png) no-repeat;
width:110px;
background-position: 0 0;
font:12px Tahoma, Arial, Helvetica, sans-serif;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:5px 0 0 0;
text-align:center;
}
a#button:hover {
background-position:0 -29px;
color:#fff;
}
</style>
</head>
Zastąp tym:
<?php
add_to_head("<style type=\'text/css\'>
a#button {
float: left;
height:24px;
background:url(http://www.nickfan.jcom.pl/images/articles/icarlym.png) no-repeat;
width:110px;
background-position: 0 0;
font:12px Tahoma, Arial, Helvetica, sans-serif;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:5px 0 0 0;
text-align:center;
}
a#button:hover {
background-position:0 -29px;
color:#fff;
}
</style>");
?>
W tej konfiguracji powinno działać lepiej, chociaż głowy nie daję. Na 100% style wylądują tam, gdzie powinny. |
| |
|
|
| Crom |
Dodany dnia 06.10.2011 22:20:12
|
Początkujący
Postów: 103
Pomógł: 15
Ostrzeżeń: 3
Data rejestracji: 26.08.2010 20:59
|
Wywal wszystkie style do jakiegoś pliku np. do Themes/Twoj_szablon/x_style.css. Potem użyj funkcji podanej wyżej przez kolegę:
<?php
add_to_head("<link rel='stylesheet' href='".THEME."x_style.css' type='text/css' media='screen' />");
?>
Przede wszystkim tag:
<head>
do wyrzucenia i jego zamknięcie też.
Edytowane przez Pieka dnia 09.10.2011 13:37:50
|
| |
|
|
| milosz1245 |
Dodany dnia 10.10.2011 16:57:28
|
Przedszkolak
Postów: 11
Ostrzeżeń: 1
Data rejestracji: 16.08.2010 22:34
|
Nadal nie działa. Stworzyłem nowy plik x_style.css
Treść x_style.css
/* kod przycisków */
a#button {
float: left;
height:24px;
background:url(http://www.nickfan.jcom.pl/images/articles/icarlym.png) no-repeat;
width:110px;
background-position: 0 0;
font:12px Tahoma, Arial, Helvetica, sans-serif;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:5px 0 0 0;
text-align:center;
}
a#button:hover {
background-position:0 -29px;
color:#fff;
}
Oraz zmieniłem treść w dodatkowych stronach na:
<?php
add_to_head("<link rel='stylesheet' href='".THEME."x_style.css' type='text/css' media='screen' />");
?>
<span>
<center><table background="http://www.nick.com/nick-assets/shows/images/icarly/themes/th_icarly_bg.jpg" width="100%" height="100%"><tr>
<td><h1 align="right">
<center><a href='http://www.nickfan.jcom.pl/infusions/twb_shopping_cart/index.php' ><img src='http://www.nickfan.jcom.pl/images/articles/reklama728x90.jpg' /></a><br /><br /></center>
<img src='http://www.nickfan.jcom.pl/images/articles/icarlyl.png' /></a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=9" id="button">Strona Główna</a>
<a href="#" id="button">O serialu</a>
<a href="#" id="button">Odcinki</a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=33" id="button">Gry online</a>
<a href="http://www.nickfan.jcom.pl/forum/viewforum.php?forum_id=38" id="button">Forum</a>
<a href="http://www.nickfan.jcom.pl/photogallery.php?album_id=1" id="button">Galeria</a>
<a href="http://www.nickpedia.jcom.pl/index.php/ICarly" id="button">Nickpedia</a>
<a href="#" id="button">Do pobrania</a>
<a href="http://www.nickfan.jcom.pl/infusions/fusionboard4/usercp.php?section=groups&view=1" id="button">Oficjalna grupa</a></span><br />
<span>
<div><p style="position: absolute; z-index: 1; right: 1.3%; top: 514px; display: inline; display: run-in"><script type="text/javascript" src="http://www.wrzuta.pl/embed_video.js?key=3cxrkD8qHBl&login=nickpolska&width=265&height=202&bg=ffffff"></script></p></div>
<div><img style="width: 100%; height: 261; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/tlo1.png"/></div>
<div><img style="position: absolute; z-index: 2; right: 35%; top: 539px; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/icarly-large-marge.jpg" alt="..." /></div>
</span>
<span class='small2'>Wszelkie prawa zastrzeżone!</span> © <span class='small2'><?php echo date('Y', filemtime($_SERVER['SCRIPT_FILENAME'])); ?> Viacom International Inc. All Rights Reserved</span>
Co jeszcze muszę zrobić aby to działało poprawnie? Proszę o pomoc i dziękuje za pomoc okazaną wcześniej. |
| |
|
|
| Crom |
Dodany dnia 10.10.2011 17:30:30
|
Początkujący
Postów: 103
Pomógł: 15
Ostrzeżeń: 3
Data rejestracji: 26.08.2010 20:59
|
Jak otwierasz tabele, to musisz ją też zamknąć, tak samo z wierszami i kolumnami. Po drugie, co masz w pliku x_style.css ? Jak ja nie widzę prawie żadnych klas, które są wykorzystywane. |
| |
|
|
| milosz1245 |
Dodany dnia 10.10.2011 18:58:17
|
Przedszkolak
Postów: 11
Ostrzeżeń: 1
Data rejestracji: 16.08.2010 22:34
|
Zmieniłem treść dodatkowej strony na:
<?php
add_to_head("<link rel='stylesheet' href='".THEME."x_style.css' type='text/css' media='screen' />");
?>
<center><table background="http://www.nick.com/nick-assets/shows/images/icarly/themes/th_icarly_bg.jpg" width="100%"><tr>
<td><h1 align="right">
<center><a href='http://www.nickfan.jcom.pl/infusions/twb_shopping_cart/index.php' ><img src='http://www.nickfan.jcom.pl/images/articles/reklama728x90.jpg' /></a><br /><br /></center>
<img src='http://www.nickfan.jcom.pl/images/articles/icarlyl.png' /></a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=9" id="button">Strona Główna</a>
<a href="#" id="button">O serialu</a>
<a href="#" id="button">Odcinki</a>
<a href="http://www.nickfan.jcom.pl/viewpage.php?page_id=33" id="button">Gry online</a>
<a href="http://www.nickfan.jcom.pl/forum/viewforum.php?forum_id=38" id="button">Forum</a>
<a href="http://www.nickfan.jcom.pl/photogallery.php?album_id=1" id="button">Galeria</a>
<a href="http://www.nickpedia.jcom.pl/index.php/ICarly" id="button">Nickpedia</a>
<a href="#" id="button">Do pobrania</a>
<a href="http://www.nickfan.jcom.pl/infusions/fusionboard4/usercp.php?section=groups&view=1" id="button">Oficjalna grupa</a></td>
<br />
<tr></table>
<div><p style="position: absolute; z-index: 1; right: 1.3%; top: 544px; display: inline; display: run-in"><script type="text/javascript" src="http://www.wrzuta.pl/embed_video.js?key=3cxrkD8qHBl&login=nickpolska&width=265&height=202&bg=ffffff"></script></p>
<img style="width: 100%; height: 261; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/tlo1.png"/>
<img style="position: absolute; z-index: 2; right: 35%; top: 539px; display: inline; display: run-in" src="http://www.nickfan.jcom.pl/images/articles/icarly-large-marge.jpg" /></div>
<span class='small2'>Wszelkie prawa zastrzeżone!</span> © <span class='small2'><?php echo date('Y', filemtime($_SERVER['SCRIPT_FILENAME'])); ?> Viacom International Inc. All Rights Reserved</span>
Teraz proszę o pomoc z tym plikiem CSS co muszę wkleić co wyrzucić, nie znam się na tym za bardzo, także proszę o wytłumaczenie. Czytałem http://www.kursht...jalne.html ale nadal nic nie rozumiem.
Połączony z 10 październik 2011 20:16:
Rozwiązałem już problem. Wystarczyło usunąć logowanie w logo (menu), Chrome inaczej interpretował treść buttonów. Lewy dobrze a prawy już się nie nakładał na lewy jak w Firefoxie tylko wszystko przesuwał, przez co parametry się nie zgadzały. Dziękuje za pomoc.
Edytowane przez milosz1245 dnia 10.10.2011 20:16:42
|
| |
|
