Skip to main content

Forums

This topic contains 5 replies, has 3 voices, and was last updated by  Ricky55 1 year, 9 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #257605

    Ricky55
    Participant

    Hi guys

    Sorry posted this in the design section rather than CSS.

    How would you go about achieving this look? Especially section A. Obviously it needs to be responsive.

    View post on imgur.com

    I have a fairly solid understanding of CSS but I’ve not done much responsive work. In fact I haven’t done much CSS at all lately.

    Not wanting anyone to do any work for me just give me a few pointers :-)

    Cheers Richard

    #257607

    Paulie_D
    Moderator

    Section A looks like two rows

    You don’t even need flexbox to do this but if you wanted to it could be used on the second row to separate the divs holding the images.

    Then move the whole second row up by using negative margin.

    #257608

    bearhead
    Participant

    I agree with Paulie_D’s method for section A.

    For section B I would use css columns.

    #257610

    Ricky55
    Participant

    Cheers Paulie. Could the hero be just an inline image or would I need to use a background?

    #257611

    Ricky55
    Participant

    Thanks bearhead I’ll take a look. Are CSS columns part of CSS Grid or is that something else?

    #257612

    Ricky55
    Participant

    Wow thanks Bearhead just seen you’ve built the entire demo, thanks man I wasn’t expecting you to go that far. Really appreciate both of your help.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star