Column Width

Hello,

am moving from column-count css to this code : Codepen

I use to have
max-width: 501px : 1 Column
min-width: 502px to max-width: 890px : 2 columns
min-width: 891px to max-width: 1200px : 3 Columns
min-width: 1201px : 4 Columns

with Max column width of 400px

How can I adjust the codepen to match the above ? P.S. Am a bit lost with the fraction.

Order Horizontally instead of Vertically in Layout

Hello,

My site is based on Joomla and I use k2 extensions to display photos in a Masonry Style (because photos are not of the same height.

The link is here : Photo website dedicated to Mauritius

The photos are displayed correctly but not in the right order.

I would like the output to be:
 
| item 1          | item 2          | item 3          | item 4 
| item 5          | item 6          | item 7          | item 8 
| item 9          | item 10         | item 11         | item 12 

problem displaying images as aspect ratio 1:1 (square thumbnails)

having an issue with getting images to display as squares in 1:1 aspect ration on wordpress.
Im pulling in Woocomece gallery images and displaying them on the page.

However as you can see in the attached screenshot the object-fill: cover; or object-fill: fill; or even object-fill: none; is not working.
They are all being treated like object-fill: contain; but I need to show square thumbnails for images of all different aspect ratios.

Here is the code I am currently trying to use:

.woocommerce-product-gallery__image {
border: solid 5px #CCC;
background-color: #CCC;

How to Convert a WordPress Site into a Mobile App?

Hello All,

I work in a mobile app development company, I have some confusion that anyone can help me with the circumstances How to Convert a WordPress Site into a Mobile App?

Thanks in advance.

Can I use CSS to bring a Frontpage 4.0 site into the 21st century?

I've been asked to be honorary editor of an online magazine and I'm trying to bring it up to date. As well as writing and editing content, I want to look at using a css file for styling and to bring in Bootstrap for display on different devices. The magazine was born in an age when phones were dumb or dumber and everyone viewed pages on a desktop!

I only have basic knowledge of CSS and a reasonable familiarity with HTML, sufficient to know when something is inefficient! Some parts I cannot change, ie the corporate style.

Syndicate content