• 0

Making a div as linkg using display: block; ? help please


Question

Hello,

im trying to make my div as a link using the display:block in css.

I need the all div to be clickable and directing to the link inside it and i cant put a div insade a <a> as its not valid.

Searching the net, i found that i should use display:block but is not working.

Here is my code:

displayblock.jpg

but is not working.

any suggestions why?

the div containg the <a> has paddings, could this be the reason?

is there anyother clean way to do it?

thanks in advance.

Link to comment
Share on other sites

7 answers to this question

Recommended Posts

  • 0

Style the <a> rather than the <div>.

<div> tags are already block level elements so setting as block isn't going to make any difference to it's default state. Set the <a> to block instead.

Link to comment
Share on other sites

  • 0

Style the <a> rather than the <div>.

<div> tags are already block level elements so setting as block isn't going to make any difference to it's default state. Set the <a> to block instead.

hey

thans for your reply

im stying the a... plz check the css


.menu_item{

font-family: 'ge_ss_text_lightregular' ,Arial, Helvetica, sans-serif;
font-size:20px;
height:50px;
position:relative;
float:right;
padding-top: 13px;
padding-left:40px;
padding-right:40px;
cursor:pointer;
}
.menu_item a{
color:#FFFFFF;
text-decoration:none;
}

.block{
display:block;
}
[/CODE]

Link to comment
Share on other sites

  • 0

ok now if i need to have another color for the link of the page being visited

example:

<a href="test.php">TEST</a>

<a href="test2.php">test2</a>

both being in the menu.

If i am in test.php how can i change the color of the link test.php? shouldnt a:active{ color:red;} do the stuff? (its placed in css after the :hover) ?

Link to comment
Share on other sites

  • 0

Add a new class like '.current-page' to the <li> of the current page item and apply a style via your style sheet, like so..

.menu-class li.current-page a {
	color:#ff0000;
}

I notice you're using floated <div> tags when you really should be using a list ( <ul> ) with each menu item being a new <li> as the navigation is an un-ordered list of links.

Link to comment
Share on other sites

This topic is now closed to further replies.