css puns

CSS-PUNS

คุณรู้จัก CSS Pun หรือไม่? - วางไว้ที่นี่และทำให้คนอื่นหัวเราะ!

 # europe . country {
  border : none;
}

. profit {
  margin : 0 ;
}

. relationship {
  display : flex;
  career : none;
}

. sonic {
  color : blue;
}

. sonic . super-form {
  @extend # goku - hair. super-saiyan ;
}

 # flash {
  position : relative;
  visibility : hidden;
}

 # mario . mini-mushroom {
  transform : scale ( 50 % );
}

. Ex-girlfriend {
  margin : 1000 px ;
}

. future {
  display : none;
}

. liberal {
  left : 100 % ;
}

. infinity-pool {
  overflow : hidden;
}

 # kim-kardashian {
  padding-bottom : 9999 px ;
}

. usa > . marijuana-laws {
  . federal {
    cursor : not-allowed !important ;
    . state {
      cursor : wait;
      & . AK ,
      & . CA ,
      & . CO ,
      & . ME ,
      & . MA ,
      & . NV ,
      & . OR ,
      & . WA {
        cursor : progress;
      }
    }
  }
}

. MVP {
  z-index : 999 ;
}

. fog {
  visibility : hidden;
}

. ego {
  display : none;
  size : 400 % ;
}

. luck {
  display : none;
}

. middle-finger {
  display : flex;
  justify-content : center;
}

. wealthy {
  top : 1 % ;
}

 # me . lookingGood {
  backface-visibility : hidden;
}

. teeth {
  gap : 10 px ;
}

. addams {
  font-family : "do do do do clap clap" ;
}

. bond {
  color : # 007 ;
}

. books . last-opened {
  display : none;
}

. jamba-juice {
  mix-blend-mode : normal;
  color : green;
}

. oliver-queen {
  cursor : arrow;
}

. up {
  animation-direction : reverse;
  float : unset;
}

. mosquito-net {
  display : grid;
}

. your-fat-darling : hover {
  transform : scaleX ( 100 );
}

. belly {
  overflow : visible;
}

. stammer {
  animation-delay : 1 s ;
}

. polluted-air {
  visibility : none;
  background-color : black;
}

 # johncena {
  visibility : hidden;
}

 # usa + # mexico {
  border : 1 px dashed;
}

. tight-pants {
  align-items : stretch;
}

 # hacktober_tshirt {
  display : flex;
  justify-content : center;
}

. periods {
  align-content : center;
  overflow : hidden;
}

. Robert-Pershing-Wadlow {
  height : 100 vh ;
}

. student : focus {
  isolation : isolate;
}

 # programmer . girlfriend {
  display : none;
}

 # who_asked {
  visibility : hidden;
  text-decoration : none;
}

 # wife {
  right : 100 % ;
  margin : 0 ;
}

. monarch {
  position : inherit;
}

. china {
  border-style : solid;
}

 # luffy . boa {
  visibility : false;
}

 # luffy . meat {
  visibility : true;
}

. aliens {
  color : green;
  visibility : hidden;
}

 # me . sleep {
  position : relative;
  padding-top : 20 % ;
  transform : skewY ( 150 deg );
}

 # what_color_am_i {
  display : block;
  margin : auto;
  width : 100 % ;
  height : 100 vh ;
  color : # fff ;
  background : linear-gradient ( -45 deg , # ff944d , # ee7752 , # e73c7e , # 23a6d5 , # 23d5ab , # 00b359 );
  background-size : 400 % , 400 % ;
  position : relative;
  animation : animate 10 s ease-in-out infinite;
}

@keyframes animate {
  0 % {
    background-position : 0 50 % ;
  }
  50 % {
    background-position : 100 % 50 % ;
  }
  100 % {
    background-position : 0 50 % ;
  }
}

 # bruce-banner {
  color : green;
  transition : 10 s ;
}

 # infinity-edge-pools {
  overflow : hidden;
}

 # bodybuilder {
  display : flex;
}

. bodybuilder + . protein {
  flex-grow : 1 ;
}

 # redmi-mobile-ads {
  display : block;
  transform : scale ( 100 % );
  filter : blur ( 20 px );
}

. ninja {
  visibility : hidden;
  color : black;
  animation-duration : 0.00001 s ;
}

. invisibility-cloak + # harry-potter {
  visibility : hidden;
}

 # tower-of-pisa {
  font-style : italic;
}

 # bruce-banner {
  color : white;
  transition : color 10 s ;
}

# bruce-banner . the-hulk {
  color : green;
}

 # over-the-fence . grass {
  color : green;
}

. illuminati {
  position : absolute;
  visibility : hidden;
}

. ghost {
  opacity : 0.1 ;
  pointer-events : none;
}

. dragon-ball {
  z-index : 9001 ;
}

. fear {
  display : none;
}

 # chucknorris {
  color : # bada55 ;
}

. yomama {
  width : 999999 px ;
}

. reader-eye {
  filter : blur ( 100 px );
  background-color : black;
}

 # rap-artist {
  word-spacing : 0 ;
}

. periodic {
  display : table;
}

 # rap-artists {
  word-spacing : none;
}

. hobbit {
  height : 50 % ;
}
. hobbit # foot {
  width : 200 % ;
}

. titanic {
  float : none;
  bottom : 0 ;
}

. sniper-mode-engaged {
  cursor : crosshair;
}

. thor-dark-world {
  background-color : black;
  display : flex;
}

 # lego {
  display : block;
}

 # titanic {
  float : none;
}

 # invisiblity-cloak {
  visiblity : hidden;
}

 # muscles {
  display : flex;
}

 # samsung {
  @extend apple;
}

 # berlin-wall {
  border-collapse : collapse;
  height : 0 ;
}

 # moses > # sea {
  column-count : 2 ;
}

 # tortoise {
  position : static;
}

 # ocean {
  background-color : blue;
}

. bambis-mom {
  cursor : crosshair;
  orphans : 1 ;
}

 # domino {
  font-style : italic;
}

. rich-people {
  top : 1 % ;
}

. working-class {
  bottom : 99 % ;
}

 # save-my-life {
  display : flex;
}

 # earth {
  border-radius : 50 % ;
}

 # ikea {
  display : table;
}

 # corona > . quarantine {
  break-inside : initial;
}

 # rip {
  bottom : -22677 px ;
}

 # weasley-family-hair {
  color : orange;
}

. autobots {
  transform : translate3d ();
}

 # deadpool {
  color : # deadbeef ;
}

 # dwayne-johnson {
  height : 150 % ;
  font-weight : bold;
}

# kevin-hart {
  height : 50 % ;
  font-weight : lighter;
}

 # goku-hair {
  color : black;
  transition : color 9001 s ;
}

# goku-hair . super-saiyan {
  color : yellow;
}

. ghost {
  display : inline;
  color : white;
  opacity : 0.1 ;
}

. karen {
  position : absolute;
  width : 200 % ;
  z-index : 999 ;
}

 # dictatorship {
  position : absolute;
}

. obese {
  width : 200 % ;
  overflow : visible;
}

 # mario . mushroom {
  transform : scale ( 200 % );
}

 # brazil {
  background : green;
  border-color : blue;
  color : yellow;
}

. internet-explorer {
  break-inside : auto;
}

 @media print {
  . news {
    content : open-quote;
  }
}

 # bermuda-triangle {
  display : none;
}

. lender + . borrower {
  visibility : hidden;
}

 # prison . escape {
  empty-cells : show;
}

. court > . advocate {
  justify-content : inherit;
}

. boku-no-pico {
  display : none;
}

 # europe {
  border : none;
}

 # big-bang :: before {
  content : "" ;
}

. optimism {
  colour : rose;
  opacity : 0.5 ;
}

 # move-forward {
  colour : green;
}

. john-cena {
  visibility : none;
}

 # stop {
  colour : red;
}

. government {
  transition : all 4 yr ease-out;
}

. uncle {
  position : relative;
}
``` ```css . ariana-grande {
  display : ponytail;
}

 # undertaker {
  transition : 1 s ease-out;
  color : black;
  opacity : 0 ;
}

 # delorean {
  z-index : -1955 ;
}

. copy-and-paste {
  cursor : not-allowed;
}

 # crustyCrab {
  color : red;
  height : 100 px ;
  position : absolute;
  visibility : hidden;
  width : 100 px ;
}

. taj-mahal {
  color : white;
  display : flex;
}

. light-mode {
  brightness(200%);

. religious-upbringing {
  perspective : inherit;
}

. dark-mode {
  brightness(0%);
}

. eminem {
  word-spacing : 0 ;
  animation-duration : 0.00001 s ;
}

 # beyonce . everything-you-own {
  margin : 0 auto 0 0 ;
}

. internet-explorer {
  visibility : none;
}

. windows-11 {
  border-radius : 10 px ;
}

. label {
  margin : 0 auto;
  display : flex;
  justify-content : center;
  align-items : center;
  border-radius : 100 px ;
  position : relative;
  cursor : pointer;
  text-indent : -9999 px ;
  width : 55 px ;
  height : 30 px ;
  background : var ( --btn );
}

. skywalks {
  opacity : 0 % ;
  border : 0 % ;
  content : "" ;
}

. democrat {
  float : left;
}

. republican {
  float : right;
}

. cupcakes-ready {
  overflow : visible;
}

. einstein {
  position : relative;
}

. internet-explorer {
  break-inside : auto;
}

. popeye + . spinach {
  width : 40 px ;
  height : 140 px ;
  transform : scale ( 10 );
}

. push-up-bra {
  margin-top : -25 % ;
  overflow : visible;
}

. Ferrari {
  color : yellow;
  width : 100 % ;
  height : 10 % ;
}

 # fiona {
  color : white;
  transition : color 10 s ;
}

 # fiona . sunset {
  color : green;
}

. money {
  display : none;
}

. volei {
  display : block;
}

. cat {
  box-sizing : content-box;
}

. vampire {
  -webkit-box-reflect : none;
}

. apple {
  color : space-gray;
}

. thumbs {
  vertical-align : top;
}

. country-music-concert {
  white-space : nowrap;
}

. center-div-bug {
  display : flex;
  justify-content : center;
  align-items : center;
  margin : 0 auto;
}

 # periodic {
  display : table;
}

. water {
  opacity : 0 ;
}

. boat {
  float : right;
}

. optimus-prime {
  transform : initial;
}

. illuminati {
  position : absolute;
  visibility : hidden;
}

. rip {
  bottom : -6912 px ;
  /* 6912px = 6 feet; */
}

. god {
  position : fixed;
}

. liberal {
  left : 100 % ;
}

. sunglass {
  opacity : 0.5 ;
}

. modest {
  flex : 0 % ;
}

. puns :: before {
  content : " " ;
}

. puns :: after {
  content : " Stomach pain, Smile, Laugh" ;
}

. rich-people {
  top : 1 % ;
}

. working-class {
  bottom : 99 % ;
}

. new-zealand {
  border : none;
}

 # guy-lafleur {
  float : right;
}

 # fear {
  display : none;
}

 # muscles {
  display : flex;
}

. street-food-business {
  margin : 0 % ;
}

. minecraft {
  display : block;
}

 # scott-lang {
  height : 100 % ;
}

. forehead {
  height : 50 % ;
}

. lego {
  display : block;
}

 # muscles {
  display : flex;
}

 # eminem-rap {
  word-spacing : 0 ;
}

 # class-board {
  box-shadow : rgba ( 0 , 0 , 0 , 0.35 ) 0 px 5 px 15 px ;
}

 # dark-web . hackers {
  visibility : hidden;
}

 # wife {
  display : none;
}

. philosopher {
  position : relative;
}

 # fat-belly {
  z-index : 100 ;
  overflow : visible;
}

. why-did-the-chicken-cross-the-road {
  text-align : left;
  text-align : right;
}

 # thanos ~ person :: nth-child ( 2 n ) {
  display : none;
}

 # future {
  filter : brightness ( 500 % );
}

. pretty {
  color : pink;
}

 # starbucks {
  color : # c0ffee ;
}

 # nsa {
  opacity : 1 ;
}

. yoga {
  align-self : center;
}

. socialDistancing {
  margin : 6912 px ; /* 6 feet */
}

. ninja {
  color : black;
  visibility : hidden;
  animation-duration : 0.0001 s ;
}

. obese {
  width : 200 % ;
  overflow : visible;
}

. ghost {
  color : white;
  opacity : 0.1 ;
}

. rap-artists {
  word-spacing : 0 ;
}

. kim-kardashian {
  padding-bottom : 999 px ;
}

 # scott-lang . ant-man {
  height : 1 % ;
}

 # scott-lang . ant-man . giant {
  height : 1000 % ;
}

. autobots {
  transform : translate3d ();
}