Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design Please help making this content responsive in Bootstrap 4

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #275905
    jubcheng
    Participant

    I’ve got this very nice shopping cart from a CodePen, but can’t make it responsive when adding it to my Bootstrap 4 layout.

    Here the CodePen:
    https://codepen.io/stonejoshuasep10/pen/azPBWN

    And here how I added it to my layout:
    https://pastebin.com/dWHLi6vu

    Any help to make this cart responsive would be very much appreciated.

    #275958
    cleverquestion
    Participant

    For starters, the whole page is only in one column (col-md-12), so Bootstrap is telling your page that everything needs to fit on one screen, regardless of the screen size. What you should do is inside the col-md-12 is break the image of the shoes into its own smaller column and the info on the right into its own column. so it would be something like:

    https://codepen.io/cleverquestion/pen/XPgBeq

    This is making the page break apart the info like this:

    [image][content] which will stack responsively like this:

    [image]
    [content]

    you also need to link the entire Bootstrap4.css file in the head where the css is.

    #275977
    jubcheng
    Participant

    ……. thanks a lot for your reply.

    I tried as you suggested, but I can’t make it work.

    Looks like I’m not advanced enough to do this on my own, but I’ll keep trying anyway.

    Thanks again …….

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Design’ is closed to new topics and replies.