CSS:n elementin ylivuoto

Задание 1

Tee div, jonka leveys ja korkeus on 200px. Lisää siihen pitkä teksti, joka ei mahdu korkeudeltaan tähän elementtiin. Tarkista, että teksti tulee ulos elementin alaosasta.

Задание 2

Muokkaa edellistä tehtävää siten, että diviin ilmestyy pystysuuntainen vierityspalkki kun teksti ylittää elementin korkeuden.

Задание 3

Muokkaa edellistä tehtävää siten, että pystysuunnasta ulospäin tuleva teksti katkaistaan.

Задание 4

Muokkaa edellistä tehtävää siten, että kun hiiri viedään divin päälle, divin korkeudeksi tulee tarpeeksi suuri, jotta koko teksti mahtuu diviin.

Задание 5

Tee div, jonka leveys ja korkeus on 300px. Lisää diviimme kuva, joka on diviä leveämpi ja korkeampi. Tarkista, että kuva tulee divin rajojen ulkopuolelle.

Задание 6

Muokkaa edellistä tehtävää siten, että kun kuva tulee ulos, ilmestyvät vierityspalkit.

Задание 7

Muokkaa edellistä tehtävää siten, että divin ulkopuolelle tulevat osat kuvasta katkaistaan.

Задание 8

Muokkaa edellistä tehtävää siten, että divin ulkopuolelle tulevat osat kuvasta katkaistaan vaakasuunnassa, ja pystysuunnassa ilmestyy vierityspalkki.

Задание 9

Tee div, jonka leveys ja korkeus on 150px. Tee niin, että riippumatta divin sisällöstä siinä on aina pystysuuntainen vierityspalkki.