473,224 Members | 1,456 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,224 software developers and data experts.

Underline one character too long

I've made up my code as below but the underline is one character longer than the word underlined.

Expand|Select|Wrap|Line Numbers
  1. div.links1 li{
  2. text-decoration:underline;
  3. display:inline;
  4. margin:10px;
  5. padding:6px;
  6. background:#cccccc;
  7. color:blue
  8. }
  9.  
Also, when I hover, having used the following code,
a:hover{color:#ff0000}
the last bit of the underline does not change colour.

I would be pulling my hair out if I wasn't bald.

Regards

Jim Walsh
Oct 12 '07 #1
5 4181
numberwhun
3,509 Expert Mod 2GB
I've made up my code as below but the underline is one character longer than the word underlined.

div.links1 li{
text-decoration:underline;
display:inline;
margin:10px;
padding:6px;
background:#cccccc;
color:blue
}

Also, when I hover, having used the following code,
a:hover{color:#ff0000}
the last bit of the underline does not change colour.

I would be pulling my hair out if I wasn't bald.

Regards

Jim Walsh
Can you please post your HTML code as well so we can see what is going on there as well?

Regards,

Jeff
Oct 12 '07 #2
Can you please post your HTML code as well so we can see what is going on there as well?

Regards,

Jeff

Hi Jeff

First you can have the CSS. This is followed by the HTML..
Expand|Select|Wrap|Line Numbers
  1. body, html{
  2. margin:0; 
  3. padding:0; 
  4. background:#a7a09a;
  5. color:#000;
  6. }
  7.  
  8. body{
  9. min-width:100%
  10. }
  11.  
  12. div.wrap{
  13. background:#cccccc; 
  14. margin:0 auto;
  15. width:100%
  16. }
  17.  
  18. div.header{
  19. background:#ddd;
  20. margin:0;
  21. padding:5px;
  22. }
  23.  
  24. div.links1{
  25. padding:5px;
  26. }
  27.  
  28. div.links1 ul{
  29. margin:0; 
  30. padding:0;
  31. font-size:14pt; 
  32. list-style:none
  33. }
  34.  
  35. div.links1 li{
  36. text-decoration:underline;
  37. display:inline;
  38. margin:10px;
  39. padding:6px;
  40. background:#cccccc;
  41. color:blue
  42. }
  43.  
  44. div.links2{
  45. padding:5px;
  46. text-decoration:underline;
  47. width:100%;
  48. background:#99ff99
  49. }
  50.  
  51. div.links2 ul{
  52. margin:0; 
  53. padding:0; 
  54. list-style:none
  55. }
  56.  
  57. div.links2 li{
  58. margin-right:-4px;
  59. margin-left:-4px;
  60. display:inline;
  61. padding-top:6px;
  62. padding-bottom:6px;
  63. padding-left:8px;
  64. padding-right:20px;
  65. background:#99ff99;
  66. color:blue
  67. }
  68.  
  69. .accomodation{
  70. background:#99ff99;
  71. margin-bottom:8px;
  72. margin-left:0;
  73. margin-right:0;
  74. padding-left:5px;
  75. padding-right:5px;
  76. padding-bottom:12px;
  77. padding-top:4px;
  78. color:black;
  79. text-decoration:none
  80. }
  81.  
  82.  
  83. div.main{
  84. float:left;
  85. width:75%;
  86. background-color:#9c9;
  87. padding-left:5px  
  88. }
  89.  
  90. div.ads{
  91. background-color:#c9c; 
  92. float:right; 
  93. width:20%;
  94. padding:0 10px
  95. }
  96.  
  97. div.ads h5, ads p{
  98. padding:0 10px
  99. }
  100.  
  101. h5{
  102. text-align:center;
  103. padding:0 10px
  104. }
  105.  
  106. a:link{color:#0000ff}
  107.  
  108. a:active{color:#0000ff}
  109.  
  110. a:visited{color:#0000ff}
  111.  
  112. a:hover{color:#ff0000}
  113.  


AND NOW THE HTML


[html]

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">


<head>
<title>Visit Bangkok</title>
<link rel="stylesheet" type="text/css" href="bkkcss.css"></link>

</head>
<body>

<div class="wrap">

<div class="header">
<h1>Visit Bangkok</h1>
</div>


<div class="links1">


<ul>

<li><span class="accomodation">accomodation</span></li>
<li><a href="bkkplacestogo.html">places to go</a></li>
<li><a href="bkkwhatson.html">what's on</a></li>
<li><a href="bkktravel.html">travel</a></li>
<li><a href="bkkmapsandguides.html">maps and guides</a></li>
<li><a href="bkkpeoplelikeyou.html">people like you</a></li>
</ul>
</div>


<div class="links2">
<ul>
<li><a href="#bkkhotels">hotels</a></li>
<li><a href="#bkkbandb">B and B</a></li>
<li><a href="#bkkapartments">apartments</a></li>
<li><a href="#bkkhostels">hostels</a></li>
<li><a href="#bkkhomestay">homestay</a></li>
<li><a href="#bkkcamping">camping</a></li>
<li><a href="#bkkcaravans">caravans</a></li>
</ul>
</div>


<div class="main">

<h2><a id="bkkhotels"></a>Hotels</h2>
<h2><a id="bkkbandb"></a>Bed and Breakfast</h2>
<h2><a id="bkkapartments"></a>Apartments</h2>
<h2><a id="bkkhostels"></a>Hostels</h2>
<h2><a id="bkkhomestay"></a>Homestay</h2>
<h2><a id="bkkcamping"></a>Camping</h2>
<h2><a id="bkkcaravans"></a>Caravans</h2>


</div>


<div class="ads">

<h5>Sponsored Advertisements</h5>

</div>


</div>
</body>
</html>
[/html]
Regards

JIm Walsh
Oct 13 '07 #3
drhowarddrfine
7,435 Expert 4TB
I don't see either problem.

You need to be aware of two other problems with your markup. First, the xml declaration, the first line, only works in modern browsers but IE chokes on it and goes into quirks mode. It is safe to remove that first line.

Second, you are serving your page as HTML yet declare XHTML version 1.1. This xhtml version is to be served as XML only. Either change to ver.1.0 or, better yet, use HTML since that is what you are serving.
Oct 13 '07 #4
I don't see either problem.

You need to be aware of two other problems with your markup. First, the xml declaration, the first line, only works in modern browsers but IE chokes on it and goes into quirks mode. It is safe to remove that first line.

Second, you are serving your page as HTML yet declare XHTML version 1.1. This xhtml version is to be served as XML only. Either change to ver.1.0 or, better yet, use HTML since that is what you are serving.


Thanks for the response but I'm not that experienced at HTML yet so I have to ask you to simplify the reply a tad please.

I can delete the first line, no problem. I can't remember why I put it there in the first place but maybe it sorted out another problem.

The second point you make is outside my scope of understanding. I thought that it was advisable to use XHTML due to it being the way forward i.e.the latest protocol for writing HTML.

Also, I can change to version 1.0 of XHTML no problem but if I were to change back what version would I need for it?


Regards

Jim Walsh
Oct 15 '07 #5
drhowarddrfine
7,435 Expert 4TB
I can delete the first line, no problem. I can't remember why I put it there in the first place but maybe it sorted out another problem.
The first line is correct and appropriate to use but Internet Explorer doesn't do xhtml, so it chokes on that line. Internet Explorer always looks at the first few letters of the first line and, if it's not a doctype, then it assumes its broken 'quirks mode'. See the article about doctypes under Articles above, or google for 'quirks mode'.
I thought that it was advisable to use XHTML due to it being the way forward i.e.the latest protocol for writing HTML.
XHTML is not HTML. XHTML is XML reformulated to work with HTML tags/elements, which is why XHTML needs the 'xml declaration' you were using above. However, as I stated above, IE doesn't understand xhtml, and Microsoft has said IE8 won't even use it, so there is no point in using it.

In addition, many people think that just adding the xhtml doctype automatically makes a browser switch to that mode. But browsers always follow what the server says the page is in the http header sent by the server first. In that header will be the line "Content-type: text/html" and that's that.

XHTML would be served as "application/xml+xhtml".

So, because browsers are told the page is html, but the page contains some xhtml elements/tags (called "tag soup"), it just treats the xhtml as broken markup. So far, this doesn't hurt anything but there are articles on the 'net stating "xhtml served as html considered harmful".
Also, I can change to version 1.0 of XHTML no problem but if I were to change back what version would I need for it?
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">[/HTML] Always use 'strict'. Modern web pages have no need for 'loose'/sloppy.[/quote]
Oct 15 '07 #6

Sign in to post your reply or Sign up for a free account.

Similar topics

6
by: Tim Daneliuk | last post by:
I am currently underling the first character of a menu title (to indicate its shortcut/accelerator key) like this: self.WildBtn = Menubutton(self.mBar, text=WILDMENU, underline=0, state=DISABLED)...
0
by: Frank Jiang | last post by:
Does anybody know how to underline in a tabcontrol's tab, as in VB6 &Cancel will show a shortcut underlined "C". I've created a shortcut by using form event handler. I need to show some sign on...
1
by: Lex | last post by:
I have a c# app that has a OwnerDrawn menu items. Is there and easy way to use DrawString to draw the underline under the mnemonic character? BTW - I figured out how to detected if we should...
29
by: jmaxsherkimer | last post by:
the site we're working on has some anchor links, you click them they scroll to the bottom of the page with the answers to the questions linked on to. is there anyway to make it so that the links...
2
by: ALok Gupta via .NET 247 | last post by:
How do I do to underline a character in the property text of Button or Label ? I have to manage the AccessKeys. THANX (Type your message here) -------------------------------- From: ALok...
5
by: Brent McIntyre | last post by:
Good afternoon all, I have a very basic problem, I am using the '&' symbol in multiple textboxes to denote 'and', unfortunately the computer doesn't understand this and keeps on underlining the...
2
by: John A Grandy | last post by:
when using StringBuilder to build-up a block of text (which is then assigned to a Label control) is it possible to underline a portion of the text ? it would seem that...
3
by: shapper | last post by:
Hello, How to make the underline of a link to be a dotted line like in this web site: http://www.iconbuffet.com/ Thanks, Miguel
6
by: dfoster | last post by:
In my form, I have four buttons that do different tasks. The button.Text field is set as &Next Project, so the N will be underlined. In the preview of the form, it shows up with the N underlined. ...
1
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...
0
by: veera ravala | last post by:
ServiceNow is a powerful cloud-based platform that offers a wide range of services to help organizations manage their workflows, operations, and IT services more efficiently. At its core, ServiceNow...
0
by: VivesProcSPL | last post by:
Obviously, one of the original purposes of SQL is to make data query processing easy. The language uses many English-like terms and syntax in an effort to make it easy to learn, particularly for...
0
by: jianzs | last post by:
Introduction Cloud-native applications are conventionally identified as those designed and nurtured on cloud infrastructure. Such applications, rooted in cloud technologies, skillfully benefit from...
0
by: mar23 | last post by:
Here's the situation. I have a form called frmDiceInventory with subform called subfrmDice. The subform's control source is linked to a query called qryDiceInventory. I've been trying to pick up the...
2
by: jimatqsi | last post by:
The boss wants the word "CONFIDENTIAL" overlaying certain reports. He wants it large, slanted across the page, on every page, very light gray, outlined letters, not block letters. I thought Word Art...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: fareedcanada | last post by:
Hello I am trying to split number on their count. suppose i have 121314151617 (12cnt) then number should be split like 12,13,14,15,16,17 and if 11314151617 (11cnt) then should be split like...
0
Git
by: egorbl4 | last post by:
Скачал я git, хотел начать настройку, а там вылезло вот это Что это? Что мне с этим делать? ...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.