Create Css Code

  • Unknown's avatar
    carlsonexteriorsinc · Member ·

    https://carlsonexteriors.com/project-type/siding/

    Can you create a Css that will cause the different siding types to appear in clean columns?

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    thesacredpath · Member ·

    Hi there, are you talking about the text at the top of that page (grey siding, dark siding, etc.)? If so, this can be a bit tricky, and the following solution comes with some drawbacks. For Chrome, Safari and Firefox, they have been supporting this for quite some time, but Internet Explorer runs at a much slower speed, and this is only partially supported by IE10 and fully supported with IE11. IE9 and earlier do not support this. 

    .portfolio-type-list.sub-type {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  text-align: left !important;
}
.portfolio-type-list.sub-type li {
  flex-basis: 23%;
}
@media screen and (max-width: 991px) {
  .portfolio-type-list.sub-type li {
    flex-basis: 30%;
  }
}
@media screen and (max-width: 699px) {
  .portfolio-type-list.sub-type li {
    flex-basis: 45%;
  }
}
@media screen and (max-width: 469px) {
  .portfolio-type-list.sub-type li {
    flex-basis: 90%
  }
}

    What version of Safari are you using? It looks like v6.0.1, which may mean we would have to make some additional adjustments before you would be able to see this.

  • Unknown's avatar
    carlsonexteriorsinc · Member ·

    Thank you for that detailed reply!

    I think I’ll just simplify the categories. I would hate for it not to function on all browsers.

  • Unknown's avatar
    thesacredpath · Member ·

    You are welcome.

  • The topic ‘Create Css Code’ is closed to new replies.