[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 466
  • Last Modified:

css text-decoration:underline

i underline a text in css like this
h1{
      text=decoration: underline;
}
but how do i set the color  and size of the underline just like we have these properties for border-bottom
border-bottom: 1px solid gray;
0
SunScreenCert
Asked:
SunScreenCert
  • 3
  • 2
  • 2
1 Solution
 
aconradCommented:
You use border to change the underline.
You can use hover to change colors for mouse over/out

http://www.hyperlinkcode.com/change-underline-color.php
:
<a href="change-underline-color.php" style="text-decoration: none; border-bottom: 1px solid #999999">change underline color</a>
0
 
SunScreenCertAuthor Commented:
But if i use border, it creates a border across the whole width of the screen and text-decoration  creates only below the text, so i cannot use border here
0
 
aconradCommented:

This code doesnt do a border across the whole width of the screen :

<a href="change-underline-color.php" style="text-decoration: none; border-bottom: 1px solid #999999">change underline color</a>
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
David S.Commented:
You could give the h1 display:inline or float:left to make it only as wide as needed.
0
 
SunScreenCertAuthor Commented:
i don't want to add php code right now
0
 
SunScreenCertAuthor Commented:
how to do it using display:inline
0
 
David S.Commented:
aconrad said nothing about using PHP. He just linked to an example.

Try this:
h1{
  display: inline;
  border-bottom: 1px solid #999999;
}

Open in new window

0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 3
  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now