+ Start a Discussion
Shruti NigamShruti Nigam 

how to increase length of line under the text.


Can anyone please help me with this situation?User-added image
Raju yadavRaju yadav

Hi Shruti Nigam,
You can use the following link for CSS

http://jsfiddle.net/u0rtd39h/

Raju yadavRaju yadav

Hi Shruti,

You can do like this its working for me.
 

<apex:page>
<head>
    <style>
        .numbers {
            line-height:10px;
        }
        
        .numbers u:after {
            content: "\00a0\00a0";
        }
        
    </style>
</head>
    <body>
        <div class="numbers">
    
            <p><u>One</u></p>
            <p>Two</p>
            <p>Three</p>
            <p>Four</p>
            <p>Five</p>
            
        </div>
    </body>
      
</apex:page>

Thanks,
Raju
Ajay K DubediAjay K Dubedi
Hi Shruti,
The CSS for your component can be like this :
 
.THIS {
}

.THIS .myText {
    border-bottom: 1px solid red;
    padding: 0 0 4px;
}

You can minimize length of border to get underline of required length.

I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks,
Ajay Dubedi