Forums

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

Home › Forums › Design › HTML responsive layout

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • August 16, 2018 at 12:28 pm #275414
    newcss
    Participant

    <

    div class=”adv-signup”>

    Sign up for E-News

    Leave your email and we’ll send you regular updates on programs, events and news.

    <

    div>

    I want to design this for tablets, desktop, etc…

    Site Background Colour Above: #fff
    Site Background Colour Below: #eff1f1
    Panel Background Blue: #2183c2
    Heading Font Family: Ubuntu (Google Font)
    Heading Font Weight: Bold
    Paragraph Font Family: Ubuntu (Google Font)
    Button Colour: #0c5382
    Paragraph Font Weight: Light

    Mobile Sizes:
    Heading Font: 22px
    Paragraph Font: 14px

    Tablet Sizes:
    Heading Font: 30px
    Paragraph Font: 18px

    Desktop Sizes:
    Heading Font: 30px
    Paragraph Font: 18px

    https://codepen.io/aspnetgal/pen/VBJEvL

    August 16, 2018 at 1:37 pm #275416
    Beverleyh
    Participant

    What’s your question? What are you asking us to help you with?

    Tip: Avoid large absolute/fixed widths – they don’t lend themselves particularly well to a responsive environment. Try relative/fluid units instead such as % or vw.

    Tip: Look in to Media Queries.

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