Support » Fixing WordPress » Creating a div layout

  • My apologies if this topic doesn’t belong here (or anywhere else on wordpress.org, for that matter), but I’m stumped and need guidance, even if only guidance to the proper place to ask.
    I hate divs’s, could never get along with them, but I must put together an HTML layout, and nowadays it seems I have no choice but to use a div layout for responsiveness and overall flexibility.
    This is what I’m trying to build: https://imgur.com/xhtL60v
    The top left square will be an image, the rest will be essentially text (links, lists, buttons…).
    I started coding it, but too many times it goes out of control… maybe it’s a problem with floats, I don’t know.
    If someone has a layout grid (not a display:grid, because I noticed that’s too rigid) example, or a link to related reading, or any kind of useful pointers, I would appreciate it very much. I’m at it for almost a week and I would really like to finally start creating content at some point…

    • This topic was modified 8 months, 3 weeks ago by Jan Dembowski. Reason: Moved to Fixing WordPress, this is not an Everything else WordPress topic
Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Steven Stern (sterndata)

    (@sterndata)

    Forum Moderator & Support Team Volunteer

    Look into CSS Grid. https://css-tricks.com/snippets/css/complete-guide-grid/

    You’ll find a bunch of grid generators, too, if you google about a bit.

    I tried LayoutIt, and the output didn’t look all that bad, but when resizing the window the grid didn’t adapt, so I became reluctant about that kind of grid.
    I’ll go through the information you referenced and see what I come up with. Thanks!

    • This reply was modified 8 months, 3 weeks ago by bufus.
    Moderator Steven Stern (sterndata)

    (@sterndata)

    Forum Moderator & Support Team Volunteer

    You’d need to have several CSS @media blocks based on min-width to get your layout to be both responsive and readable.

    Unfortunately, I must admit I know very little about CSS, I just basically hack through it. I think I’ve seen pre made media blocks somewhere, so I’ll get them.

    I’d still like to take a shot at the standard div structures. I was too close to making one work to give up now 😀 (just have to subdue my left image, as it refuses to center when the browser window is reduced).

    Thanks for the tips!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Creating a div layout’ is closed to new replies.