Avatar of Neil Thompson
Neil Thompson
Flag for United Kingdom of Great Britain and Northern Ireland asked on

CSS floats, how can I get these to line up (ie left float up a bit) when the left/right column is bigger thatn its neighbour

I have a list of links which fit together nicely but when some are bigger they obviously increase the min-height of the others and drop the next floated item down.

original
Is there any way I can get any that wrap over and leave a gap to "shift upwards" to keep everything neat? a bit like this...

required
CSS

Avatar of undefined
Last Comment
Neil Thompson

8/22/2022 - Mon
ASKER CERTIFIED SOLUTION
Greg Alexander

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
Greg Alexander

Or you could just run the items down two independent columns.
Brandon Lyon

Depending on your required browser support you can:

Use javascript as the previous poster mentioned
Use  HTML tables
Try some of the new CSS3 features like column layouts : How to use CSS3 columns
Member_2_248744

According to the developers for the firefox browser, you should NOT use the CSS float as a method to to allow non concerned alignment, you may find that using the  CSS  display:inline-block;  gives a more correct relative positioning, however as all browser output, there will still be alignment PER LINE, the display shown in your second PNG image, does not have a PER LINE alignment, so a two column approach, as galexander07 suggested, might be the way to get that visual display.

Can you show us the HTML and CSS you use for your output, then we can have a better idea of what to do for a better end result.
This is the best money I have ever spent. I cannot not tell you how many times these folks have saved my bacon. I learn so much from the contributors.
rwheeler23
Neil Thompson

ASKER
Thanks all for your comments, this one will suit my needs best :)