Autor | Zpráva | ||
---|---|---|---|
mantisa Profil |
#1 · Zasláno: 6. 10. 2007, 12:34:16 · Upravil/a: mantisa
ahoj,
nezakládal bych nové téma, kdybych nezkusil vše. CSS: #paticka { width: 770px; margin: 40px auto 0 auto; background: url('../img/paticka.gif') no-repeat 0 0; } #paticka-text-vlevo { float: left; text-align: left; margin: 13px 0 40px 10px; display: inline; } #paticka-text-vpravo { float: right; text-align: right; margin: 13px 10px 40px 0; display: inline; } #paticka a { font-weight: normal; padding: 1px 2px 1px 2px; border: none; } #paticka a:hover { background-color: #C10000; color: #FFFFFF; text-decoration: underline; } #paticka a img { border: none; text-decoration: none; } #paticka a:hover img { background-color: #FFFFFF; } #paticka p { margin-bottom: 3px; font-size: 0.9em; color: #4B4B4B; } HTML: <div id="paticka"> <div id="paticka-text-vlevo"> <p><a href="#"><img src="img/tiskarnicka.gif" alt="tiskárna" width="13" height="10"></a> <a href="">Vytisknout</a></p> <p><a href="">Klávesové zkratky</a></p> </div> <div id="paticka-text-vpravo"> <p>Foto: <a href="http://www.broken-arts.com/">brokenarts</a>, design a kód: <a href="http://www.mantisa.cz/">Mantis–a</a></p> <p><a href="/">Bla Bla Bla</a>, 2007. Všechna práva vyhrazena.</p> </div> <div class="cistic"> </div> </div> při najetí na obrázek tiskárny mi to zobrazí kolem obrázku zhruba 2 px silný rámeček; netuším ale, jak se ho zbavit... další věc - IE standalone mi bere podmíněné komentáře typu: <!--[if lte IE 5.5000]><link rel="stylesheet" type="text/css" href="css/styl-ie5.css" /><![endif]--> na dvou html stánkách pohoda a na třetí mi je nebere, jak to je možné? děkuji za jakoukoli osvětu |
||
Miloš Profil |
#2 · Zasláno: 6. 10. 2007, 12:57:28
Podmíněné komentáře ve standalone verzích za běžných okolností nefungují, ale prý se s tím dá něco dělat.
S tím ráměčkem mě nic nenapadlo, ale proč tam ten obrázek nedáš jen jako background-image? |
||
mantisa Profil |
#3 · Zasláno: 6. 10. 2007, 13:02:39
Miloš
asi to jako background udělám, ale zarazilo mě toto chování... ty podmíněné komentáře jsou pro mě taky zahádou, fungovat nemají, ale u dvou ze tří html stránek fungují :-) |
||
Miloš Profil |
#4 · Zasláno: 6. 10. 2007, 13:08:23
mantisa
ty podmíněné komentáře jsou pro mě taky zahádou, fungovat nemají, ale u dvou ze tří html stránek fungují :-) Esli se nepletu, tak fungují IF IE, ale už takhle běžně neodlišíš jednu verzi od druhé. |
||
mantisa Profil |
#5 · Zasláno: 6. 10. 2007, 13:11:45
Miloš
mně fungují i odlišené právě, záhada jinak ten obrázek stále řeším, protože ho chci taky klikací |
||
Bubák Profil |
#6 · Zasláno: 6. 10. 2007, 13:31:51
Udělej třídu pro pozadí hover textových odkazů, obrázkové odkazy ponechej "normální".
|
||
mantisa Profil |
#7 · Zasláno: 6. 10. 2007, 14:19:08
Bubák
tohle jsem malinko nepobral, mohl bys prosím polopatičtěji, díky |
||
Bubák Profil |
#8 · Zasláno: 6. 10. 2007, 14:33:10
#paticka a.zvyraznit:hover {
background-color: #C10000; color: #FFFFFF; text-decoration: underline; } <p><a href="#"><img src="img/tiskarnicka.gif" alt="tiskárna" width="13" height="10"></a> <a class="zvyraznit" href="">Vytisknout</a></p> Až teď jsem si všimnul, že pro odkazy máš nastavený padding, ten ti dělá "rámeček". |
||
mantisa Profil |
#9 · Zasláno: 6. 10. 2007, 14:42:40 · Upravil/a: mantisa
Bubák
padding je samozřejmě první, po čem jsem šel, ani jeho vynulování nezabralo |
||
Bubák Profil |
#10 · Zasláno: 6. 10. 2007, 14:53:30
Máš padding v téhle deklaraci:
#paticka a { font-weight: normal; padding: 1px 2px 1px 2px; border: none; } Pokud ho vymažeš, tak "rámeček" zmizí, ale pak nebudeš mít padding u textových odkazů. |
||
mantisa Profil |
#11 · Zasláno: 6. 10. 2007, 15:24:56
Bubák
však to je to, co myslím, padding jsem odebral, přesto rámeček setrvává, popravdě řečeno pouze jeho horní a dolní okraj, jinde padding definovanej nemám každopádně, proč nejde udělat, aby obrázek neměl padding a texty měly? |
||
mantisa Profil |
#12 · Zasláno: 6. 10. 2007, 18:32:45
kdo tohle vyřeší, tomu patří metál...
|
||
Plaváček Profil |
#13 · Zasláno: 6. 10. 2007, 18:43:34
mantisa
Děláš to blbě, tiskárnička prostě má být pozadím odkazu a tím pádem bude také klikací. Pokud ale trváš na tomhle podivném kódu, řešení je prosté: #paticka a img { border: none; display: inline; float: left; margin: 0.2em 0 0 0 } |
||
mantisa Profil |
#14 · Zasláno: 6. 10. 2007, 18:57:07
Plaváček
dík, to už jsem pochopil, ale trval jsem na řešení, přesto ani Tvoje není ideální, pravá strana rámečku se objevuje, přesto díky |
||
Plaváček Profil |
#15 · Zasláno: 6. 10. 2007, 19:02:24
mantisa
Když děláš jednoduché věci složitě, tak se nediv. Pak musíš odkazu, ve kterém je obrázek, přiřadit třídu a zrušit ten nastavený padding. Ostatně, nastavovat horní a dolní padding inline prvku je zhola zbytečné, pokud se nemýlím. |
||
mantisa Profil |
#16 · Zasláno: 6. 10. 2007, 22:50:22
Plaváček
jsem nějak mimo, ale teď mě nenapadá elegantní způsob jak udělat, aby se měnilo při hoveru pouze pozadí textové části... za radu budu vděčen, případně to nechám na ráno, snad to po ránu vymyslím :-) |
||
Plaváček Profil |
#17 · Zasláno: 7. 10. 2007, 06:55:35
mantisa
Tak jenom rychlá ukázka (ale možností je samozřejmě povícero): http://klient.plavacek.net/tisk.html |
||
mantisa Profil |
#18 · Zasláno: 7. 10. 2007, 10:53:13
Plaváček
samozřejmě, že děkuji velmi pane, ale jak jsem ráno vstal, tak jsem to vymyslel, každopádně přesto Ti patří můj velký dík |
||
mantisa Profil |
#19 · Zasláno: 7. 10. 2007, 10:57:59
Plaváček
samozřejmě, že děkuji velmi pane, ale jak jsem ráno vstal, tak jsem to vymyslel, každopádně, přesto Ti patří můj velký dík |
||
Časová prodleva: 16 let
|
0