Columns

Resolved pare81
(@pare81)

9 years, 3 months ago

Hi Greg,

wish you a good start into 2017.

could you please check your stylesheet for column styles?
I think there are no styles for 4 column list.

Thanks and regards
Pare

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

Plugin Author Greg Winiarski
(@gwin)

9 years, 3 months ago
There are styles for 2,3,4,5 columns in the adverts-frontend.css file.
```
.adverts-form .adverts-input-1-4 {
    width: 25%;
}
.adverts-field-rows-4 > div {
    width: 25%; 
    float: left;
}
.adverts-flexbox-columns-4 {
    width: 23%;
    margin: 0% 1% 2% 1%;
}

@media all and (min-width: 0px) and (max-width: 760px) {
    .adverts-categories-top .adverts-flexbox-columns-4 {
        width: 48%;
        margin: 0% 1% 2% 1%;  
    }
    
    .adverts-categories-all .adverts-flexbox-columns-4 {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}
```
The above is code specific to generate 4 columns.
Eve
(@etransac)

9 years, 3 months ago

hi Greg,

I think he’s referring to the advert item column..like this

.advert-item-col-4 {
width: 24%;
margin: .50%;
}

.advert-item-col-4:nth-child(4n+1) {
width: 24%;
margin: .50% .50% .50% .50%;
}

.advert-item-col-4:nth-child(4n+2) {
width: 24%;
margin: .50% .50% .50% .50%;
}

.advert-item-col-4:nth-child(4n+3) {
width: 24%;
margin: .50% .50% .50% .50%;
}
.advert-item-col-4:nth-child(4n+4) {
width: 24%;
margin: .50% .50% .50% .50%;
}

i added the above code to your adverts-frontend.css file to create 4 column advert list 😉
Thread Starter pare81
(@pare81)

9 years, 3 months ago
yes, thats right Eve. within optionpanel i can choos 4 columns, but there is no css for this. I’ve added also this by myself to my css. But think this should be done by plugin. I use the following:
```
.advert-item-col-4 {
		width: 24%;
		margin: 1%;
	}

	.advert-item-col-4:nth-child(4n+1) {
		width: 24%;
		margin: 1% 1% 1% 0%;
	}

	.advert-item-col-4:nth-child(4n+2) {
		width: 23%;
		margin: 1% 1% 1% 1%;
	}

	.advert-item-col-4:nth-child(4n+3) {
		width: 23%;
		margin: 1% 1% 1% 1%;
	}
	.advert-item-col-4:nth-child(4n+4) {
		width: 24%;
		margin: 1% 0% 1% 1%;
	}
```
and than i changed this by mediaquery min/max width to other column counts.
- This reply was modified 9 years, 3 months ago by pare81.
Plugin Author Greg Winiarski
(@gwin)

9 years, 3 months ago

The [adverts_list] supports either 1, 2 or 3 columns (as explained in the documentation https://wpadverts.com/documentation/creating-ads-list-adverts_list/) if you want to have more, you need to paste additional CSS in your theme CSS file.

Thread Starter pare81
(@pare81)

9 years, 2 months ago

Thanks, but then the option to use 4 columns within your optionspage is wrong 🙂

Plugin Author Greg Winiarski
(@gwin)

9 years, 2 months ago

Ohh, you are correct i will resolve this (by either removing “4” from the list or by adding additional CSS) in next release.

Thread Starter pare81
(@pare81)

9 years, 2 months ago

Thanks for your reply 🙂

Would be nice if 4 columns will be standard 🙂

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

The topic ‘Columns’ is closed to new replies.