Can CSS do something like this

Discussion in 'HTML & Website Design' started by ketting00, Mar 13, 2015.

  1. #1
    Hi guys,

    I wonder if I can do something like this with CSS.

    Here's what I'm talking about. Look at the image of facebook's header for desktop below:
    desktop.png

    Can I shrink it to have this very look:
    mobile.png
    I mean responsive design and it would happen when you view it on different screen sizes.

    I know that's the desktop version and mobile version, but can I do that?

    How? Or should I give it a redesign.

    Big thanks,
     
    ketting00, Mar 13, 2015 IP
  2. PoPSiCLe

    PoPSiCLe Illustrious Member

    Messages:
    4,623
    Likes Received:
    725
    Best Answers:
    152
    Trophy Points:
    470
    #2
    Yes, of course you can.
    @media-queries in CSS is your friend.
     
    PoPSiCLe, Mar 13, 2015 IP
  3. ketting00

    ketting00 Well-Known Member

    Messages:
    782
    Likes Received:
    28
    Best Answers:
    3
    Trophy Points:
    128
    #3
    OK, I got this.

    It takes a bit of redesign. Thanks.
     
    ketting00, Mar 13, 2015 IP
  4. bluebelt91

    bluebelt91 Well-Known Member

    Messages:
    879
    Likes Received:
    9
    Best Answers:
    0
    Trophy Points:
    130
    #4
    Try
    <meta name=viewport content="width=device-width>
    in your site Header code
     
    bluebelt91, Mar 16, 2015 IP