borders around columns

Resolved cbridges
(@cbridges)

12 years, 11 months ago
I would like to add borders around each column. I used custom CSS to modify the text, margins etc.. and added borders to this css. All of it works except the borders (they do not show)
For example
```
.one_half
{
	font-size: 85% !important;
	width: 49% !important;
	margin-right: 2%!important ;
	border:medium!important;
	border-color:#333 !important;
}
```
I have searched and but cant seem to find anything that answers this. Thanks in advance for any help!

http://wordpress.org/extend/plugins/column-shortcodes/

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

Michael
(@alchymyth)

12 years, 11 months ago

as this is more or less a pure formatting question, posting a link to your site will greatly help to find out why the borders are not showing;

you could also try to use a browser inspection tool to investigate the formatting of the columns.
Plugin Author Tobias Schutter
(@tschutter)

12 years, 11 months ago
Your CSS does not validate. Try the following:
```
.one_half
{
	font-size: 85% !important;
	width: 49% !important;
	margin-right: 2% !important ;
	border-style: solid !important;
	border-width: medium !important;
	border-color: #333 !important;
}
```
Thread Starter cbridges
(@cbridges)

12 years, 11 months ago

Thanks for the replies. I tried to update code and seem to get nothing. I’m assuming it will end up being a simple code issue but I’m obviously overlooking it! Heres a link to first page of test site
Thank you for the help
Test page

Thread Starter cbridges
(@cbridges)

12 years, 11 months ago

I figured it out…actually I dont know what happened. I updated code and viewed the page. The border was not there. However when I logged out of WordPress and viewed the page, the borders showed up. Thank you for the help!
Thread Starter cbridges
(@cbridges)

12 years, 11 months ago
Ok, a couple of more questions.

First, my test site looks fine in IE but in Firefox and Chrome, the columns line up on top of each other. If I change the width to 48%, they fit on firefox and chrome also. Shouldn’t 49% be 49% on any browser? Here is a link to my test site main page

Second, I want to change the border of the last column, would the code below be acceptable when using for example [one_half][/one_half][one_half_last][/one_half_last]
```
.one_half{
	font-size: 85% !important;
	width: 49% !important;
	margin-right: 2% !important ;
	border-bottom-style: solid !important;
	border-bottom-width: thin !important;
	border-bottom-color: #436EEE!important;
}
.one_half.last.column
{
	font-size: 85% !important;
	width: 49%!important ;
	margin-right: 0px!important ;
         border-bottom-style: solid !important;
	border-bottom-width: thin !important;
	border-bottom-color: #000000 !important;
}
```
Thank you!
Plugin Author Tobias Schutter
(@tschutter)

12 years, 11 months ago
The easiest way to solve this would be to add your own class to the shortcode, like so:
```
[one_half_last class="noborder"]
My content.
[/one_half_last]
```
This will enable you to target this specific column by it’s class and remove it’s border.
```
.one_half_last.noborder {
        border: none !important;
}
```
Thread Starter cbridges
(@cbridges)

12 years, 11 months ago

Tobias, That worked! Thank you so much for your help.

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

The topic ‘borders around columns’ is closed to new replies.