How to delimiter the margins or padding on WebView so that my text doesn't appear over the border drawing background?

▲
0
▼

I load a simple html text inside of my WebView. I put a backgound image on it and I'd like to adjust the text scroll only inside my image. Today it is on the border, take a look at the image:

Image example

My code html that is loaded inside my WebView

    <!DOCTYPE html>
<html>
    <style> 
       .cab1{ color:#800000; font-weight: 900; text-align: center; }
       .cab2{ color:#B22222 } 
       .ul {margin-top:5px; list-style-type:square; margin-left:-20px}
       .body{bgcolor:#FFFFE0}

    </style>
    <body class='body'>
        <div>
            <p class="cab1">Pesquisa de Combinações de Cartas</p>
            <ul>
                <li class="cab2" >Combinação Carta 10</li>
                <ul class='ul'>
                    <li>c10 + c05 - Lesões</li>
                    <li>c10 + c05 - Feridas</li>
                    <li>c10 + c05 - Dores dolorosas</li>
                    <li>c10 + c05 - Intervenção médica</li>
                    <li>c10 + c05 - Vida em perigo</li>
                    <li>c10 + c05 - Biópsia</li>
                </ul>
            </ul>
            <ul>
                <li class="cab2">Área da Saúde ( partes do corpo, doenças e infernidades )</li>
                <ul class='ul'>
                    <li>c10 + c05 - Perigo de vida</li>
                    <li>c10 + c05 - Saúde em perigo</li>
                    <li>c10 + c05 - Cirurgia</li>
                </ul>
            </ul>

            <ul>
                <li class="cab2">Área da Saúde 2 </li>
                <ul class='ul'>
                    <li>c10 + c05 - Perigo de vida</li>
                    <li>c10 + c05 - Saúde em perigo</li>
                    <li>c10 + c05 - Cirurgia</li>
                </ul>
            </ul>

            <ul>
                <li class="cab2">Área da Saúde 3</li>
                <ul class='ul'>
                    <li>c10 + c05 - Perigo de vida</li>
                    <li>c10 + c05 - Saúde em perigo</li>
                    <li>c10 + c05 - Cirurgia</li>
                </ul>
            </ul>

            <ul>
                <li class="cab2">Área da Saúde 4</li>
                <ul class='ul'>
                    <li>c10 + c05 - Perigo de vida</li>
                    <li>c10 + c05 - Saúde em perigo</li>
                    <li>c10 + c05 - Cirurgia</li>
                </ul>
            </ul>

            <ul>
                <li class="cab2">Área da Saúde 5</li>
                <ul class='ul'>
                    <li>c10 + c05 - Perigo de vida</li>
                    <li>c10 + c05 - Saúde em perigo</li>
                    <li>c10 + c05 - Cirurgia</li>
                </ul>
            </ul>
        </div>
    </body>
</html>

My webView code

mWeb.setBackgroundColor(0x00000000); // transparent 
mWeb.setBackgroundResource(R.drawable.pergaminho01); // My image is loaded here
mWeb.loadDataWithBaseURL(null, html, "text/html", "UTF-8", null); // my variable html is loaded here

I hope I could transmit what I am trying to do and got any help from you Thanks for your help Regards

android
android-layout
layout
asked on Stack Overflow Apr 23, 2020 by alexhaifa

1 Answer

▲
0
▼

I found a solution, all the things I had to do is change the HTML adding this code in my main DIV:

<div style="width: 400px; height: 300px; overflow-y: scroll; margin-top:250px">

Regards

answered on Stack Overflow Apr 24, 2020 by alexhaifa

User contributions licensed under CC BY-SA 3.0