Autor Zpráva
antabe
Profil
Dobrý den.
Chtěl bych vás požádat o radu, jak vyřešit toto:

Mám jednořádkový odstavec a část textu v něm potřebuji zarovnat vlevo a část textu vycentrovat na střed.

Napsal jsem to takhle:

<p>tohle má být vlevo<span style="text-align: center">tohle na středu</span></p>

ale nefunguje, mně to. Můžete mně prosím poradit jak to správně napsat?
Str4wberry
Profil
antabe
Proč nepoužít ty odstavce dva:
<p>…

<p style='text-align: center'>…


Případně by mělo stačit nastavit spanu display: block.
antabe
Profil
Str4wberry

opisuji a formátuji kroniku, cílem je mimo jiné, aby bylo zachováno formátování textu, tak jak je psán text v originále = takže odstavec s řádkem musí být jenom jeden


A druhému způsobu a to se velmi omlouvám, nerozumím, jak jste to myslel? Mohl bych vás požádat o celý zápis? Moc by jste mně pomohl. Strávil jsem už nad tím tolik času, hledal jsem v odpovědích, ale nenašel jsem nic co by mně pomohlo. Byl bych rád, děkuji.
Str4wberry
Profil
antabe
Myslel jsem to takto:
<p>tohle má být vlevo<span style="text-align: center; display: block">tohle na středu</span></p>
antabe
Profil
no jo, to jsem zkusil, ale hodilo mně to to co potřebuji na střed na nový řádek. A to je špatné
Str4wberry
Profil
antabe
Tak to nějak elegantně a univerzálně vyřešit nepůjde, pokud vím. Něco mě přece jen napadlo.

1) Ten span relativně „vypozicovat“ nahoru (position: relative; top: -15px} — top je nutné synchronizovat s výškou řádku (line-height). Popř. záporný margin.
2) Nastavit spanu nějaké levé odsazení (margin-left) a opticky ho vyrovnat.
Bubák
Profil
<div style="line-height: 0; margin: .3em 0 .2em;">
<div>text vlevo</div>
<div style="text-align: center">nějaký text uprostřed</div>
</div>
antabe
Profil
Bubák

Moc a moc děkuji. Jste borec. Perfektní! To je přesně ono, co jsem potřeboval. Díky.

PS - Tak tohle bych sám nesvedl ani náhodou.
antabe
Profil
Str4wberry

ano než napsal odpověď "Bubák" přesně to jsem zkoušel - vložit záporný margin, ale musel jsem to opticky srovnávat. Takže to nebylo to pravé ořechové. Udělal jsem to, ale dalo to moc práce a navíc se musí člověk spoléhat na to, že to dobře srovná podle oka.
Řešení od "Bubáka" je elegantní. Samozřejmě moc děkuji i tobě za snahu a nápad.
Str4wberry
Profil
antabe
Vkládat 3 divy místo jednoho spanu mi nepřipadá zrovna elegantní. Ale jak myslíte. Když mnou popsané řešení by mělo dělat to samé:

<p style='line-height: 16px;'>tohle ma být vlevo<span style="text-align: center; display: block; position: relative; top: -16px; margin-bottom: -16px">tohle na stredu</span></p>
habendorf
Profil
Teda na můj vkus to řešíte všichni nějak moc složitě. Já osobně bych to floatnul.
antabe
Profil
Str4wberry

Omlouvám se, nechtěl jsem vás urazit. Jsem začátečník, takže se chytám každého stéblíčka. Asi jsem to špatně formuloval, a to že jsem si troufl nebo dovolil posuzovat co je "elegantnější, asi nebylo vhodné, když tomu nerozumím.

Vyzkoušel jsem i vaše řešení a je to perfektní. Asi jenom odborník je chopen posoudit (protože vidí všechny výhody i nevýhody - já ne) co je lepší.

Děkuji vám moc a doufám, že mně zachováte přízeň.
antabe
Profil
habendorf


Já osobně bych to floatnul > a to je prosím pěkně co?
Bubák
Profil
Vkládat 3 divy místo jednoho spanu mi nepřipadá zrovna elegantní.
Je fakt, že stačí dva elementy:

<div style="line-height: 0; margin: .5em 0 .4em;">text vlevo
<div style="text-align: center">nějaký text uprostřed
</div>
</div>

habendorf
Já osobně bych to floatnul.
Zrovna si nemůžu vzpomenout, jak dát float a centrování dohromady, přitom vím, že jsem to tak už jednou dělal, dokonce jsem měl dvě řešení:
vystředění do zbylého volného místa
"obyčejné" vystředění
habendorf
Profil
Bubák

Pořád na to jdeš hrozně složitě.

<p style="text-align:center"><span style="float:left">Text vlevo</span>Text uprostred</p>

Samozřejmě v reálu doplnit cleaner a případně nějakou omezující šířku pro span.
Manq
Profil
antabe
Že by to habendorf zarovnal pomocí float:left/right;

EDIT: Pozdě, habendorf má rychlejší připojení k Inetu.
antabe
Profil
habendorf

Samozřejmě v reálu doplnit cleaner a případně nějakou omezující šířku pro span

A tohle by bylo ještě potřeba udělat jak, prosím?

PS
Jenom čumím a čtu s otevřenou pusou.
Manq
Profil
antabe
Cleaner se řešil tady http://diskuse.jakpsatweb.cz/index.php?action=vthread&forum=7&topic=59 740 .

A s tou šířkou - <span style="float:left;width:100px;">
habendorf
Profil
antabe

<p style="text-align:center">
<span style="float:left;width:300px">Text vlevo</span>
Text uprostred
<br style="clear:both;height:0;line-height:0;font-size:0;" />
</p>
antabe
Profil
Děkuju všem co jste se zapojili do diskuse. Nikdy bych nevěřil, že okolo tohoto dotazu bude tolik názorů na věc. Díky, jsem chytřejší a dobře si poznamenám řešení.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0