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

Home Forums CSS Responsive CSS shapes

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #205174

    I’m trying to create a flag-shaped sidebar with padded body text in it. The problem is, the reference I found only shows how to use absolute values such as pixels. I need the sidebar to be responsive like the rest of the site, but every time I try to use something like percentages, the shape falls apart.

    The Reference I was using:


    It depends on what you are trying to do. Perhaps you could make a Codepen.

    Here’s a comment I made from a similar question yesterday

    It depends what you mean by responsive.

    Fixed px value borders…obviously not responsive.

    em value based borders, a little better, they react to font size.

    vh/vw value based borders, marginal but at least they react to viewport size.

    % based borders – don’t exist.

    Also, perhaps related this question that’s been ‘raging’
    So…what’s the question again?


    I want my flag shape to adjust in width according to the device being used to view it. It’s currently serving as one of two columns in my layout. I can make everything else in the layout responsive easily enough, but my left column/flag remains inflexible. All my attempts thus far to make it flexible destroy the flag shape.


    Show us what you have in a demo and we’ll see what we can do.

    Can’t work with code we haven’t seen.

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