Help alter simple code real quick
 

I can pay you if you want but I cannot afford much. Better to trade. I will trade my services for the correct answer to this question.

USING THIS CODE:


^^^^^^ that is a shortcode in my wordpress theme. It spawns category columns. I need to eliminate the VERTICAL spaces so the columns fit/interlock vertically with each other.

SEE THIS PICTURE:
https://i.imgbox.com/Dnd9QFHX.jpg

you clearly see the vertical spaces I need those spaces gone. I know it can be done by altering the code I inserted above. Go to https://pornranx.com to see for yourself.

MAYBE SOMEONE CAN BE NICE FOR ONCE IN THEIR LIFE AND JUST GIVE ME THE SOLUTION FOR A KISS AND A HUG?:pimp

What is the problem right now and how it should be?
Can you put it in pastebin?

I just can guess that you want to shorter it, but how exactly it should look like?

Without looking too much into the code or the website, if it is a styling problem, add this to one of the columns:

````
.multi_cat{
/* put the right value here */
max-height: 420px;
overflow-y: scroll;
}
````

If this is a PHP problem, there query request if for 150 posts (in 2 places), reduce this number.

thanks but....
 

thanks for attempting to help but i think you misunderstand the issue.


I have only one issue, I simply want the eliminate the blank spaces. Right now each column set in static rows. So right now it is 4 columns per row and the row is static. I need each column to VERTICALLY link with the ones above. Look at my picture and code.

Here I have created two quick illustrations:

BEFORE(HERE IS WHAT IT LOOKS LIKE NOW):
https://i.imgbox.com/zYYL4rKN.png

AFTER (HERE IS WHAT I WANT IT TO LOOK LIKE):
https://i.imgbox.com/nAuOrjY6.png

SEE? The empty vertical space i want it gone, I want the columns tightly fit together.

Please look at the code I posted in top of this thread and see if there is a line I can alter to make this happen.


Thanks.

Looks more like a CSS issue than PHP, for example if I wanted to do that similar to a grid theme, I'd set CSS to float left plus a couple of other things depending how the DIVs are set up, probably needs clear or something like that.

If you want, PM me the URL and I'll take a closer look.
Edit: I missed the URL. Looking now. :upsidedow

in dcae4.css remove
.col_wrap_fourth .col_item:nth-child(4n+1) {
clear: both;
}
and it will be somewhat better, columns will flow depending on height, not be placed in rows.

what you want is this, try playing:
https://isotope.metafizzy.co/layout-modes/masonry.html

Thanks fellas.....
 

Okay so after the one guy said "CSS" I was like yep your right. Here is the only CSS code related to the columns I need to change.

If you can look at that and tell me what to change to make it look like the "AFTER" illustration from my second post above I will suck your dick and gobble your balls.

You seem to be the one who can help me
 

I see your suggested code already in the css but obviously it is not configured right.

Please please PLEASE look at this code and tell me what to do :(

oh and.....
 

here is the url https://pornranx.com

He means take this line and remove it and see if that helps: :upsidedow
.col_wrap_fourth .col_item:nth-child(4n+1) { clear: both;}

I've been busy today but I might get a chance to look at it more later tonight.

backup before you make a change, and try to replace with this css pastebin com /vQBnSa2s

Almost!
 

FIRST OFF THANK YOU SO MUCH FOR YOUR HELP

Almost fixed it but now new issues. As you can see from the picture below the columns are starting to float together but there is still a large space in the 3rd column and the 4th column is perfect as far as vertical space but now it seems that all of my new categories are piling up in that fourth column. I created those categories after the code change to see how it would look and seems like they are all getting assigned to fourth column crowding up on the far right there......

HERE IS WHAT IT LOOKS LIKE NOW AFTER THE CODE CHANGE:

https://i.imgbox.com/QdcW5R1u.jpg

this might make it easier
 

to make it easier for you to see how the columns are now after code change and possibly what needs to be done to make it right i created many dummy posts to fill out the opage better so you can see. It seems the 4th column is the only one vertically spacing right and the others are all different and not correct.

HERE IS PICTURE WITH DUMMY POSTS FOR BETTER UNDERSTANDING:

https://i.imgbox.com/jlAX8zRW.jpg

you might want to look at this: masonry desandro com

for a Pinterest grid. Examples:
codepen io /tag /masonry

For easy integration go to Codepen or make a small HTML file, create multiple <div /> with different heights and add a new class to each div (.your-prefix-grid)

Then on your template you will only need to add 1 script and 1 class.

I haven't read the Codepen's examples and don't remember how to implement it, but it should be simple.

OMG i have no fucking clue how to do any of that or even what language your speaking hahaha. Please tell me is there ANYTHING i can do for you to get you to help me make this work? I do a lot of freelance. I do blog writing, descriptions, uploads, and a lot more. Just tell me what you want. I am desperate.

Didn't go through the replies and just posted this anyway.

the issue is just css:

Here is the css that you have to change:

.col_wrap_fourth .col_item:nth-child(4n+1) {
clear: both;
}

Thanks but...
 

Yes others have said this but what do I need to change? Just delete that line altogether? My theme has a custom css box in theme options what should I write in that box? OH AND THANKS FOR YOUR REPLY.

remove clear:both or you can delete that altogether.