CSS inline és margin-bottom együtt

Címkék
CSS inline és margin-bottom együtt
2022-02-21T14:36:25+01:00
2022-02-21T19:36:18+01:00
2022-10-15T21:20:47+02:00
Breaknet
Sziasztok!

Van az alábbi kódom:

h3 { font-size: 1em; font-weight: bold; display: inline; } p.inline { font-size: 1em; margin-bottom: 2em; } <h3>I. Fejezetcím:</h3><p class="inline">Fejezetszöveg</p> <h3>II. Fejezetcím:</h3><p>Fejezetszöveg</p> <h3>III. Fejezetcím:</h3><p>Fejezetszöveg</p>


Azt szeretném elérni, hogy így legyen megformázva a szöveg:



I. Fejezetcím: Fejezetszöveg

II. Fejezetcím: Fejezetszöveg

III. Fejezetcím: Fejezetszöveg


Tehát a <h3> és <p class="inline">-nal formázott szövegrészek sortörés nélkül jelenjenek meg, de minden ilyen blokk után legyen egy üres sor. Két darab <br>-rel a fejezetszöveg után nyilván meg tudnám csinálni, de talán szebb lenne css-sel. A "margin-bottom: 2em;" gondolom azért nem működik, mert ott az inline paraméter is.

Köszönöm előre is!
Mutasd a teljes hozzászólást!
Hali!

… ami SEO szempontból nem túl szerencsés.

Túl nagy jelentőséget tulajdonítasz ennek a SEO-nak nevezett „misztikumnak”.

Más lehetőség van?

Igen, lehet trükközni. Pl. a p tag ::after pszeudo-elemének adsz szabályt, amiben a tartalom egy-két soremelés-karakter (\a), white-space-nek pedig pre értéket adsz. De eljárhatsz úgy is, hogy szintén ennek a pszeudo-elemnek a megjelenítését block-ra állítod, magasságát pedig 1-2-szeres sormagasságra. Működés közben: JSFiddle

Mutasd a teljes hozzászólást!

Címkék
Tetszett amit olvastál? Szeretnél a jövőben is értesülni a hasonló érdekességekről?
abcd