Autor Daniel Dočekal (Kontakt) chlívek (Webdesign, Internet) - vydáno 19.8.2003
PÚOVINY *** Zatracený problém s HTML/CSS
Zpropadené podbarvování článků zlobí - dneska jsem konečně přišel na to KDE to zlobí, ale zaboha nemůžu přijí na to PROČ a hlavně na to jak to vyřešit. Volání o pomoc je tu. *DOPLNĚNO*
Dneska jsem chtěl původně psát o tom jak jsem si k obědu dal zvláštní vrabce z králíka (a dušené zelí, záruka dobrého oběda) a jak si náš obchodní ředitel u pokladny ukázkově do oběda namočil kravatu, ale místo toho jsem se začal (doslova) patlat v kódu.
Články na POOH.CZ jdou podbarvit (například mou oblíbenou žlutou FFFF10). Jenže když se sejde podbarvení a k tomu ikona článku, vznikne zvláštní jev - ikona je vidět. Titulek a podtitulek článku ovšem vidět není. Jedině pokud ho vezmu do bloku (kurzorem, viz obrázek), tak se objeví.
HTML a CSS jsem si nakonec musel vzít stranou a postupně jsem ho osekával a osekával. Až zbyl jeden styl a jeden odstavec (viz níže). Pokud si to uložíte do souboru a zobrazíte v IE, tak uvidíte o co jde.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Language" content="cs">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style>
.artlinks {
text-align: right;
clear:both;
}
</style>
</head>
<body>
<div style="background: red; color:black;">
<div >
<h3 >
<img class="imgright" src="http://www.pooh.cz/upload/img/1100/vystavaikona.jpg" align="right" border="0" alt="xxx" width="120" height="90">
Tenhle text je titulek článku a má být vidět</h3>
<p >Tenhle text je perex článku a má být vidět</p>
<p class="artlinks">BlaBla, má být pod obrázkem a zarovnáno vpravo</p>
</div>
</div>
</body>
</html>
Toho podivného efektu se zbavím, pokud odstraním obrázek (což nejde). A taky pokud odstraním "clear: both" - pak ovšem, pokud je příliš krátký perex (podtitulek), neskončí ta řádka s odkazy pod obrázkem, ale někde vedle něj (je obtékací) - a to nechci. Měla by být zarovnaná uplně doprava aby to mělo nějaký řád.
Můžu tu řádku taky zarovnat doleva a problém taky bude pryč. Jenže, proč to nejde normálně?
Zajímavé je i to, že pokud změním šířku okna IE, tak se ten text po určitém zůžení objeví.
Jsem klasicky přesvědčen na 90%, že je to nějaká moje blbost. A tak na 10%, že je to blbost v IE.
Kdo poradí?
--- ---
Takže, rady mám dvě, obě vypadají jako funkční.
Dušan Yuhůů Janovsky ( www.jakpsatweb.cz ) poradil použít "position: relative" - tu je nutno vrazit do stylu pro <h3> titulek i pro <P> odstavce perexu (podtitulku).
Vedlejší efekt je, že se mi rozsypala anketa :) Takže v praxi to můžete vidět teď. Rozsypání ale napraví ostylování ankety (nemá vlastní styly, důvodem je lenost).
Marek Prokop ( www.sovavsiti.cz) poradil prozměnu nastavit "width: 100%" pro nějaký "vnější" prvek - nastavil jsem to zkusmo pro <div> sloužící k podbarvení a vypadá to funkční, jenom musím ověřit jestli to není moc "100%" řešení - ten podbarvený bxo se totiž odmítá od určitého momentu zmenšit.
--- ---
Problému se věnuje i Letem Světem v blogpostu Vygumovaný Explorer.
Užitečný je i odkaz, který se objevil v ohlasech :
http://positioniseverything.net/explorer/peekaboo.html
Poslední změna : 20.8.2003 08:05, Vytvořen : 19.8.2003 16:58, Vydán : 19.8.2003, 5455x
TrackBack : [ http://www.pooh.cz/o.asp?ar=2005898 ]
Aktuální články autora |
KRÁTCE A AKTUÁLNĚ @ FACEBOOK
Další témata
E-knihy (E-books) ■ iPad ■ Zpoplatnění internetového obsahu ■ Google Android ■ Nokia 900 ■ Marketing, reklama, PR ■ Windows 7 tipy a triky ■ Google Wave ■ Dragon Age Origins ■ Chrome a Chromium ■ World of Warcraft ■ Google Buzz ■ Ubuntu tipy a triky
REKLAMA
DOPORUČENÉ ČTENÍ
- 29. 7. 2010
- Jak získat 100 milionů údajů o uživatelích…
- 27. 7. 2010
- Vláda by měla zrušit stovky zbytečných webů
- 26. 7. 2010
- Všechno co jste chtěli vědět o Facebooku
- 22. 7. 2010
- TIME magazine pouze na iPadu nebo na papíře a…
- 22. 7. 2010
- Nové hledání obrázků v Google. Nedotažený Bing s…
- 18. 7. 2010
- Truth about Coke a Už nikdy nebudu pít Colu -…
- 16. 7. 2010
- CERD varuje před Alešem Slabým (Deredes)? To už je…
- 1. 7. 2010
- Nové nastavení soukromí na Facebooku nechává vše…
- 28. 6. 2010
- Orwell v praxi - Google na dálku smazal z mobilů…
- 25. 6. 2010
- fb:like (facebook Like Button) a jak na něj
AKTUÁLNÍ TISKOVÉ ZPRÁVY
- Check Point dosáhl ve 2. čtvrtletí 2010 rekordních hospodářských výsledků více
- Personální novinky ve vedení společnosti Telefónica O2 více
- O2 vyhlašuje 2. srpen Dnem pokrývačů více
- TDP-Ontrack upozorňuje na úskalí imagingu více
- SONY: Nové objektivy Alfa více
- Citrix zavádí první nástavbové certifikáty v oboru virtualizace více
- Telefónica O2 Czech Republic – Finanční výsledky za první pololetí 2010 více
- Symantec zveřejnil výsledky červencové zprávy MessageLabs Intelligence Report více
- Panasonic HM-TA1 - kamera, ke které nepotřebujete návod více
- HDC-SDX1 - videokamera, se kterou si hravě poradíte vy i váš počítač více