Border around widgets in Twenty Eleven theme

At it’s most basic, you need to alter this style rule:

.widget {
  clear: both;
  margin: 0 0 2.2em;
}

To something like:

.widget {
  border: 1px solid;
  clear: both;
  margin: 0 0 2.2em;
  padding-left: 20px;
}

Of course, you can set your own border colour and width etc. If you want rounded corners you’ll have to do all the usual stuff with background images if you want IE to display them. Or you can use CSS and not worry about IE users.

You need the padding to ensure that bullet points are enclosed in the border.

HTH

PAE

Do not edit the Twenty Eleven theme. It is the default WordPress 3.2 theme and having access to an unedited version of the theme is vital when dealing with a range of site issues.

Create a child theme for your customisations. Once your child theme is active, we should be able to help with the customisation.

Thanks Esmi – you can rest assured I have created a child theme so all good to go there ??

Thanks again for your help Peredur! Will give that a go and see what I can come up with!