Div layout from app.html to specific view-models

Help Requests
1

I am trying to layout my customer.html with <div> and I’m having trouble understanding just how app.html’s layout and the specific view model’s layout interact.

I’ve got a gist: https://gist.dumber.app/?gist=b7b0d05a40c781676fbfd99347c4cd89

It shows my problem.

The Customer Information and Notes section should be underneath the Index Row form, and Invoice List (not visible right now because of the way the divs are all messed up) should be underneath Customer Information and Notes.

Any help would be appreciated.

2

Can you give some visual clarification of what you want it be? It’s a bit confusing trying to guess what you mean based on the existing layout image

3

I am trying to make it look relatively like this.

The first left panel is Customer Information, the panel to the right is Notes.

Underneath it all is Invoices.

image
image1884×1150 328 KB

1 Like
4

Well, this is CSS issue. While I’m sure it’s easy to fix, there’s no way I can guess how to fix by comparing 2 different layout images :smile:

5

Can you explain a little more about how it is a CSS issue? I was just trying with divs, and if there’s a better way to try, I’d like to know.

Thanks in advance.

1 Like
6

You may find it easier to accomplish what you want by using a css framework (apologies if you already are - not sure if you are or not).

I really like https://bulma.io/ but of course there is Bootstrap or Foundation etc.

2 Likes
7

Thank you.

I also took a closer look at the css I’ve been importing, and it was forcing things to be in certain positions by way of pixels. So I adjusted those layouts, and added what I needed, and it’s working now. (I did not update the gist).

1 Like