/    Sign up×
Community /Pin to ProfileBookmark

Quick question about hyperlinks

Hey guys,

I’m trying to figure out how to do something that is probably pretty simple, but I’m not quite sure how to make it work. In the following link, the text that says “1”, “2”, and “3” is clickable.

[url]http://thebestinfo.org/test123.html[/url]

What I’d like to do is make the entire red area of each of the 3 parts clickable. For example, the entire top red area should hyperlink to 1.html, the entire middle red area should hyperlink to 2.html, and the entire bottom red area should hyperlink to 3.html.

Does anyone know what I would have to change to make this work?

Here is the entire HTML code for that page…

[CODE]

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

<html>

<head>

<style type=”text/css”>

body {
background: white;
}

#nav ul {
list-style: none;
}

#nav li {
background: Red;
width: 50%;
margin: auto;
height: 2em;
text-align: center;
padding-top: 1em;
}

#nav li a {
text-decoration: none;
color: White;
}

</style>

</head>

<body>

<div id=”nav”>

<br />

<ul>
<li><a href=”1.html”>1</a></li><br />
<li><a href=”2.html”>2</a></li><br />
<li><a href=”3.html”>3</a></li><br />
</ul>

</div>

</body>

</html>

[/CODE]

Thanks! ?

to post a comment
HTML

3 Comments(s)

Copy linkTweet thisAlerts:
@TheAliveWinnerFeb 25.2012 — You may use:
[code=html]
#nav li a {
text-decoration: none;
color: White;

display: list-item; /* this creates a block for the list box */
/* you may also use 'display: block;' to cause the element to generate a block box */
}
[/code]
Copy linkTweet thisAlerts:
@BMAN99authorFeb 25.2012 — You may use:
[code=html]
#nav li a {
text-decoration: none;
color: White;

display: list-item; /* this creates a block for the list box */
/* you may also use 'display: block;' to cause the element to generate a block box */
}
[/code]
[/QUOTE]


Awesome. Thank you! ?
Copy linkTweet thisAlerts:
@TheAliveWinnerFeb 25.2012 — Awesome. Thank you! ?[/QUOTE]

You are welcome! B-)
×

Success!

Help @BMAN99 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.12,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...