Category: HTML

Categories
HTML PHP WordPress

Redirecting home page for mobile devices

<?php
  $ua = $_SERVER['HTTP_USER_AGENT'];
  if((strpos($ua,'iPhone')!==false)|| 
  (strpos($ua,'Android')!==false)) {
  header("Location:/mobile/");
  exit();
}
?>
Categories
CSS HTML

iframe Responsive Fluid Width (Youtube, Google Map, etc,)

.iframe-wrap {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}
.iframe-wrap iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}

<div class="iframe-wrap">
    <iframe width="560" height="315" src="https://www.youtube.com/embed/pEIu-WG-D-s" frameborder="0" allowfullscreen=""></iframe>
</div>
Categories
CSS HTML

How to hide placeholder with CSS

::-webkit-input-placeholder {
   opacity: 0;
}
:-moz-placeholder { /* Firefox 18- */
   opacity: 0;  
}
::-moz-placeholder {  /* Firefox 19+ */
   opacity: 0;  
}
:-ms-input-placeholder {  
   opacity: 0;
}

Reference: http://frontendbabel.info/articles/styling-placeholder-using-css/

Categories
CSS HTML

CSS – Add commas to each span except the last one

<div class="wrap">
    <span>AAAA</span>
    <span>BBBB</span>
    <span>CCCC</span>
    <span>DDDD</span>
</div>
.wrap > span:not(:last-child):after {
	content: ", ";
}

Result
AAAA, BBBB, CCCC, DDDD

Categories
HTML

Making div height to auto-adjust to background size

<div style="background-image: url(http://your-image.jpg);">
    <img src="http://your-image.jpg" style="visibility: hidden;" />
</div>