Newbie help: galleries

[flunkster]

Hi, new user, not coder so please bear with me and on the pro trial at the moment.

I have created a static front page with images and links. This works as expected. Then link to various other pages with image galleries. The image gallery pages don't render correctly in browser. All the images all flat and underneath each other. This is local not online yet.

I will require a detailed explanation, sorry...

[ben]

Hi Duncan, welcome aboard the Wappler train.

Wappler uses the Bootstrap framework for layout, styling and components. It is therefore beneficiary to learn the Bootstrap framework. The best way to do that is to create a project like yours and refer to the documentation as you go along.

In this case, you need to have a proper understanding of the Bootstrap layout

Bootstrap Layout

Core Concept Bootstrap is a mobile first responsive design framework. This means that any styling - like setting the number of columns - in mobile view, will also apply to larger screens. This can be offset by applying different styling to larger screens. Conversely, setting a style to larger screen sizes will not affect smaller screen sizes. This is an important concept to remember to avoid layout problems. Containers Containers are the most basic layout element in Bootstrap and are requi…

Read up on the following topics:

1. Containers
2. Bootstrap Grid
3. Grid Options
   3.1. Auto Layout Columns
   3.1.1. Equal Width
   3.2. Responsive Classes
   3.2.1. Row Colimns

I hope that helps.

[web-works]

@ben, you forgot to mention you excellent tutorial on galleries. Gallery tutorial by Ben