Vierityspalkkeja käytetään muuttamaan sovellusikkunassa näkyvän sisällön, useimmiten asiakirjasivun, sijaintia. Oletuksena ne näkyvät automaattisesti, jos ikkunan leveys tai korkeus ei riitä koko avoimen sivun näyttämiseen. Siksi päästäksesi eroon vaakasuorasta vierityspalkista, sinun on muutettava joko sen sivun tai sovellusikkunan leveyttä, jossa se on auki.
Ohjeet
Vaihe 1
Loitonna sivu - tämä on helpoin tapa poistaa vaakasuuntainen vierityspalkki sivua tarkasteltaessa. Missä tahansa selaimessa tämä voidaan tehdä vetämällä hiiren kiekkoa itseäsi kohti samalla kun pidät Ctrl-näppäintä painettuna. Monet tekstieditorit (esimerkiksi Microsoft Word) tukevat myös tällaista sivun zoomauksen hallintaa. Selaimissa voit käyttää myös miinusnäppäintä hiiren sijaan. Jokainen napsautus tai pyörän kääntäminen yhden luukun verran loitontaa 10%, kunnes vaakakoko on riittävän suuri näyttämään sivun ilman vaakasuuntaista vierityspalkkia.
Vaihe 2
Käytä selaimen kykyä manipuloida verkkosivun lähdekoodia ja muuttaa siinä määritetyt näyttötyylit vastaamaan ikkunan leveyttä - joillakin verkkoselaimilla on tämä vaihtoehto. Esimerkiksi Opera-selaimessa sinun tarvitsee vain napsauttaa "Sovita leveydelle" -kuvaketta, jolloin vaakasuuntainen vierityspalkki katoaa, ja tarkastellun sivun sarakkeet muuttavat kokoa. Jos on tarpeen palata sisällöntuottajan määrittelemään sivun asetteluun, napsauta tätä kuvaketta uudelleen.
Vaihe 3
Kun luot verkkosivuja, poista koko sivun tai sen yksittäisten lohkoelementtien vaakasuora vieritys käytöstä CSS overflow-x -ominaisuuden avulla. Tämä ominaisuus on otettu käyttöön CSS: ssä versiosta 3.0 lähtien, ja kaikki modernit selaimet tukevat sitä. Sille osoitettavat arvot ovat automaattisia, piilotettuja, vieritettäviä, näkyviä. Jos tätä ominaisuutta ei ole määritelty tyylikuvauksissa, sen arvon katsotaan olevan auto, ts. Vaakasuoran vierityksen tulisi näkyä, kun sisältö ei sovi elementin leveydelle. Voit poistaa vierityksen käytöstä kaikissa tapauksissa käyttämällä piilotettua arvoa. Esimerkiksi:
body {overflow-x: hidden;}
