CSS: make links inside text widget of same width as container

2 Views

I’ve added some text links in a sidebar text widget at my wordpress site footer. Now I’m trying to make the text links have the same width as its div container. However, after trying hard the links remain with a smaller width.

The text I’ve added inside the text widget goes like this:

Read More
<p><a href="/contacto">Contacto</a></p>
<p><a href="/faqs">FAQs</a></p>
<p><a href="/politica-de-privacidad">Política de Privacidad</a></p>
<p><a href="/terminos-y-condiciones">Términos y Condiciones</a> </p>

And the general html structure is this:

enter image description here

Finally, the resulting footer links look like this:

enter image description here

I’ve tried to use: 

display: inline-block; 
clear:both; 
float:left;`

at #text-6.widget.widget_text, but I get nothing. The aside label seems to be display:block by default.

Post Views: 2

Related posts

1 comment 

  1. .widget a
{
display: block;
padding: 5px;
width: 100% //added for testing purposes
}

    or

    .textwidget a
{
display: block;
padding: 5px;
width: 100% //added for testing purposes
}

    You can use !important as well if you want to overwrite all styles for the a tag.

    I added the padding just as an example.

Comments are closed.