Issues with display:block

  • Resolved ninjaninja

    (@ninjaninja)


    11 years, 5 months ago

    Hi,

    I am trying to make the entire “cell” of my menu a link, so even if you arent highlighting the word “home” for example it will still change text colour and be a link.

    Ive added display:block into a few places in my CSS but this hasnt worked

    can anyone help?

    https://pure-rubbish.co.uk/

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)

  • What you need to do is take the padding from your list items and apply it to the link (a) elements instead. All the styling for the hover effect should be on those links.

    Thread Starter ninjaninja

    (@ninjaninja)

    Hi,

    Thanks for the respinse.

    I added padding: 5px 1em; to header nav .menu ul li but it made the menu much bigger with gaps around the links still?

    Thanks

    You need to add the padding to the link and take it OFF the li.

    Remove:

    header nav .menu ul li {
  padding: 5px 1em;
}

    Add:

    header nav .menu ul a {
  padding: 5px 1em;
}

    Thread Starter ninjaninja

    (@ninjaninja)

    Thanks so much! Thats done it!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Issues with display:block’ is closed to new replies.