Autor | Zpráva | ||
---|---|---|---|
tester Profil * |
#1 · Zasláno: 14. 3. 2016, 15:31:22
Můžete poradit jak uspořádat obrázky v hlavičce stránky?
V divu mám odstavec p, pod kterým chci mít v jedné řadě dva obrázky ze shora (na obrázku A je název webu a na obr. B je motto) (p půjde asi pryč) a dole pod nimi je menu. Pomocí toho stylu níže se dostanu na oba obrázky, ale já pořebuju zpřístupnit každý zvlášť. Teď se mi ten obrázek A opakuje i na ten druhý span. Zkoušel jsem použít + ale nepovedlo se. <DIV id=head> <div id=header> <p> <span>A</span><span>B</span> </div> <menu id=mainmenu> div#header p:first-child span {padding-left:48px; padding:0; margin:0; display: block; width: 151px; height: 35px; background-image: url( images/A.png); background-repeat: no-repeat; } menu#mainmenu { display: block; } A druhá věc, co pak musím udělat aby B bylo vedle A? Oběma dát float: left a prvním dát clear:both; ? P má být nahoře, pod ním má být A+B a dále asi budu muset dát tomu menu float: left;. |
||
doby Profil * |
tester:
a proč to chceš dát jako pozadí a nepoužiješ klasicky img? // HTML <div id="head"> <div id="header"> <span class="a_nazev"></span> <span class="b_motto"></span> </div> </div> // CSS <style> #header span{ display: inline-block; width: 151px; height: 35px; padding: 15px; } span.a_nazev{ background: url('./images/a.png') no-repeat; } span.b_motto{ background: url('./images/a.png') no-repeat; } </style> oprava span.b_motto{ background: url('./images/b.png') no-repeat; } |
||
Bubák Profil |
#3 · Zasláno: 14. 3. 2016, 17:39:46
Nechápu, proč v CSS na prvém řádku deklaruješ levý padding a na tomtéž řádku o jednu deklaraci dál ho nuluješ.
Proč dáváš :first-child odstavci?
Koukni na: Živá ukázka Odkaz V ukázce jsem namísto obrázkového pozadí použil dvě různé barvy. table-cell funguje až od IE 8, snad ti to nevadí, pokud by ti to vadilo, použij display-inline , ale pak se nějak budeš muset zbavit mezery mezi inline elementy (pokud mezera vadí), třeba tak, že oba elementy budou v kódu zapsány bez mezery, tak jak to máš na 4. řádku HTML kódu.
|
||
tester Profil * |
Už se mi to povedlo. Stačilo najít tuto stránku.
Img mi nepříjde tak dobrý jako blokové prvky. Pokud si pamatuji tak jsem s tím vždycky měl problém že když to chci nějak vycentrovat, odsunout nebo něco tak mi to nešlo. Proto používám vnitřní okraj či odsazení a to img nemá myslím. Zkoušel jsem to ještě v Opeře a drží to tak by to mělo být dobrý. Chrome taky v pohodě. Ještě mě na té stránce pár věcí hapruje jako centrování. Asi ještě pisnu. K tomu p. Padding a margin jsou přeci různé věci. p:first-child span má říkat že je to první span uvnitř div#header p:first-child span+span že je to druhý span uvnitř p jestli se to tak nedělá tak sorry, css mi nikdy moc nešlo a nebaví mě to Ještě dotaz. Proč v FF32 nevidím to žluté zvýraznění a v novější Opěře jo? www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_firstchild_more4 mně :firstchild v FF funguje ale tady na té stránce ne |
||
Bubák Profil |
tester:
„p:first-child span má říkat že je to první span uvnitř“ Ne, první span uvnitř je p span:first-child
„div#header p:first-child span+span že je to druhý span uvnitř p“ Ne, druhý span je div#header p span:first-child+span
„Proč v FF32 nevidím to žluté zvýraznění a v novější Opěře jo?“ Já jsem ve FF32 „ to žluté zvýraznění“ viděl. |
||
tester Profil * |
#6 · Zasláno: 14. 3. 2016, 19:13:31
Zkoušel jsem tvůj kód. Upravil jsem to podle tebe a jede to taky. Dík
|
||
Časová prodleva: 9 let
|
0