Help with css nav button content?

BobMCT · Oct 8, 2009

Everyone;

I am running into an issue while trying to add a "hot" question mark in my css based menu buttons. When I add the link for the character "?" to the right of the existing content it results in another button being generated upon display.

-Results Facsimile-

----------------
| How it Works |
----------------
| Testimonials |
----------------
| ? |
----------------

Here are some snippets of code to peruse:

-HTML Snippet-


<ul class="nav">
<li><a href="$PHP_SELF?s=4">How it Works</a></li>
<li><a href="$PHP_SELF?s=5">Testimonials</a>
<span class="helpBox">
<a href="helpBox.php?hid="1">?/a>
</span></li>
</ul>

-CSS Snippet-

/* Navigation Control(s) for Left Menu */
.nav {
display: block;
margin: 0px auto;
padding: 8px;
list-style-type: none;
}
/* Help Pop-up Box */
.helpBox a,
.helpBox a:active,
.helpBox a:visited {
background-color: #ff0000;
font-size: 1.3em;
font-weight: bold;
padding: 1px 2px;
margin-left: 5px;
color: #fff;
text-decoration: none;
}

As you can see, the added <a> results in a separate button box. I simply desire it to be to the right of the original content of "Testimonials" but have a separate link for the word "Testimonial" and the character "?".

Any ideas?

Thanks all - Bob [3eyes]

traingamer · Oct 8, 2009

You must not be providing enough of an example because this:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/loose.dtd">[/URL]
<html>
<head>
<style type="text/css">
/* Navigation Control(s) for Left Menu */
.nav {
 display: block;
 margin:  0px auto;
 padding: 8px;
 list-style-type: none;
}
/* Help Pop-up Box */
.helpBox a, 
.helpBox a:active,
.helpBox a:visited {
 background-color: #ff0000;
 font-size:        1.3em;
 font-weight:      bold;
 padding:          1px 2px;
 margin-left:      5px;
 color:               #fff;
 text-decoration:  none;
}
</style>
</head>
<body>
<!-- Setup Left Side Button Menu -->
<ul class="nav">
  <li><a href="$PHP_SELF?s=4">How it Works</a></li>
  <li><a href="$PHP_SELF?s=5">Testimonials</a>
   <span class="helpBox">
   <a href="helpBox.php?hid="1">?</a>
   </span></li>
</ul>
</body>
</html>

works for me (in IE6). (It also works without the doctype.)

I'm guessing that you have some other css that you did not provide that is causing the problem - sorry I can't be more specific.

Greg
People demand freedom of speech as a compensation for the freedom of thought which they seldom use. Kierkegaard

BillyRayPreachersSon · Oct 8, 2009

Perhaps it's the typo in the original source code? Note the missing closing tag:

Code:

<a href="helpBox.php?hid="1">?,[!]<[/!]/a>

Dan

Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Help with css nav button content?

BobMCT

IS-IT--Management

traingamer

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor