Keskustelu: Nettisivujen teko: Otsikon ja tekstin välinen rivi

<h4>Otsikko</h4>
<p>tekstiä</p>

Eli yksinkertaisesti haluaisin poistaa noiden kahden tekstin välille ilmestyvän tyhjän rivin, mutta en joka paikasta, vaan vain tietyistä kohtaa sivua.

Simppeliä, mutta onnistuuko helposti?

Tuottaako tämä toivomasi tuloksen?

<h4 style="margin-bottom:0;">Otsikko</h4>
<p style="margin-top:0;">tekstiä</p>

Joo kyllähän tuo toimii noin. Kiitos vain.

style-attribuutin käyttö on huono tapa. Sama muodossa, jonka voi laittaa suoraan ulkoiseen tyylitiedostoon:

h4 {
  margin-bottom: 0;
}

h4+p {
  margin-top: 0;
}

Jarzka kirjoitti:

Eli yksinkertaisesti haluaisin poistaa noiden kahden tekstin välille ilmestyvän tyhjän rivin, mutta en joka paikasta, vaan vain tietyistä kohtaa sivua.

Tuolla tavallahan kaikki otsikot ovat samallalailla muotoiltuja, siispä, miksi ei käyttää style-attribuuttia?

Hakoulinen kirjoitti:

Jarzka kirjoitti:

Eli yksinkertaisesti haluaisin poistaa noiden kahden tekstin välille ilmestyvän tyhjän rivin, mutta en joka paikasta, vaan vain tietyistä kohtaa sivua.

No sehän nyt on ihan liikaa vaadittu, että lukisin alkuperäsen viestin ^_^;

Hakoulinen kirjoitti:

[Tuolla tavallahan kaikki otsikot ovat samallalailla muotoiltuja, siispä, miksi ei käyttää style-attribuuttia?

No siltikään ei käytetä styleä, vaan annetaan sille otsikolle joku luokka, ja tyylitellään sitten sen luokan perusteella.

.jokuluokka {
  margin-bottom: 0;
}

.jokuluokka+p {
  margin-top: 0;
}

Pienenä huomiona tässä välissä, että plussavalitsinhan ei toimi ainakaan IE6:ssa, mutta IE:ssä ei toisaalta myöskään ole muistaakseni kappaleissa yläreunassa yhtään marginaalia tai sisennystä muutenkaan, jolloin lopputulos on tässä tapauksessa sielläkin osastolla halutunlainen.