CODEWITHSUNDEEP
flexboxbootstrap-4
Khaled A
Khaled A

Reputation: 63

Bootstrap 4 and breakpoints

I am tying to create a UI in photoshop that will be used to render a full-width site. I have never used flexbox before and I've never created a full-width site before using it.

I'm wondering if I simply stick to the default bootstrap breakpoints or if I need to be doing something entirely different.

An example of the type of full-width layout: full-width sample

Upvotes: 0

Views: 148

Answers (1)

iLuvLogix
iLuvLogix

Reputation: 6420

Thou this is a very general question, I'd have following advice for you:

I would use both, grid & flexbox, since, grids are great for building the bigger picture and make it really easy to manage the overall layout of the page. They are also able to handle more unorthodox and asymmetrical designs.

Flexbox is great at aligning the content inside elements so you can use flexboxes to position the smaller details of a design.

You could use CSS grids for 2D layouts (rows AND columns) and Flexbox for one dimension only (rows OR columns).

There is no reason to use only CSS grids or only flexbox - they work well together in their respective field of usage.

For layouting and screencasts I can definitly recommend Adobe XD - quite fresh in the Adobe-family and free for now.

I hope that gave you some idea how to approach your project andf plan the layout according to your needs.

EDIT:

Have a look at this article - it should give you a fair understanding on how to set breakpoints according to your layout and the media/device.

Upvotes: 1

Related Questions