<body id="vanilla_discussions_index">
<header id="top">
<div>
<a href="/">
Flex<span>-Tricks</span>
</a>
</div>
</header>
<div id="Body">
<nav id="main-nav">
<a href="/">
<span data-icon="" aria-hidden="true"></span>Home
</a>
<a href="/forums/">
<span data-icon="9" aria-hidden="true"></span>Forums
</a>
<a href="/snippets/">
<span data-icon="Q" aria-hidden="true"></span>Snippets
</a>
<a href="/gallery/">
<span data-icon="p" aria-hidden="true"></span>Gallery
</a>
<a href="/video-screencasts/">
<span data-icon="q" aria-hidden="true"></span>Videos
</a>
<a href="/almanac/">
<span data-icon="ó" aria-hidden="true"></span>Almanac
</a>
<a href="/downloads/">
<span data-icon="w" aria-hidden="true"></span>Demos
</a>
<a href="/lodge/">
<span data-icon="6" aria-hidden="true"></span>Lodge
</a>
</nav>
<div id="Content">
<div class="left">
<div>
<h1>
All Discussions
</h1>
</div>
<ul>
<li>
<div>
<h2>
<a href="/forums/discussion/19264/horizontal-scrolling-inside-divs-on-mobile-devices">[Solved] Horizontal scrolling inside divs on mobile devices</a>
</h2>
<div>
<span>4 comments</span>
<span>Most recent by <a href="/forums/profile/42509/JDDurrant">JDDurrant</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24493/bootstrap-navbar-question">Bootstrap Navbar Question</a>
</h2>
<div>
<span>1 comment</span>
<span>Started by <a href="/forums/profile/39513/jubcheng">jubcheng</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24484/how-was-this-made">How was this made?</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/37897/srig99">srig99</a></span>
<span>April 28</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24492/wordpress-custom-tax">Wordpress custom tax</a>
</h2>
<div>
<span>1 comment</span>
<span>Started by <a href="/forums/profile/38082/bastunqk">bastunqk</a></span>
<span>April 28</span><span><a href="/forums/categories/php">PHP Problems</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24483/using-fitvids-js-as-a-popup-lightbox">Using fitvids.js as a popup lightbox</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/32688/notfilc">notfilc</a></span>
<span>April 28</span><span><a href="/forums/categories/javascript">JavaScript Jungle</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24408/navigation-menu-box-shadow-confusion">[Solved] Navigation menu box shadow confusion</a>
</h2>
<div>
<span>29 comments</span>
<span>Most recent by <a href="/forums/profile/33091/simpletwist">simpletwist</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24489/jquery-slidedown-and-up">JQuery Slidedown and Up</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/16597/Mottie">Mottie</a></span>
<span>April 28</span><span><a href="/forums/categories/javascript">JavaScript Jungle</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24083/php-contact-page-doesn039t-work">[Solved] PHP contact page doesn't work</a>
</h2>
<div>
<span>9 comments</span>
<span>Most recent by <a href="/forums/profile/41517/ArmsVsLegs">ArmsVsLegs</a></span>
<span>April 28</span><span><a href="/forums/categories/php">PHP Problems</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24487/right-side-text-not-lining-up-over-image-css">Right Side Text Not Lining Up Over Image CSS</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/21173/Paulie_D">Paulie_D</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24482/joomla-in-a-line-submenys">Joomla in a line submenys</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/21173/Paulie_D">Paulie_D</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24486/css-image-creation">[Solved] CSS Image Creation</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/21173/Paulie_D">Paulie_D</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24485/wordpress-tags-search-destroys-layout">[Solved] Wordpress Tags search destroys Layout</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/14791/aarongmoore">aarongmoore</a></span>
<span>April 28</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24104/png-to-svg-pattern-conversion">[Solved] png to svg pattern conversion?</a>
</h2>
<div>
<span>4 comments</span>
<span>Most recent by <a href="/forums/profile/42347/waybetter">waybetter</a></span>
<span>April 27</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24469/chat-solutions">Chat solutions</a>
</h2>
<div>
<span>4 comments</span>
<span>Most recent by <a href="/forums/profile/14783/chrisburton">chrisburton</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24479/correct-way-to-add-a-bottom-border-between-nav-items">[Solved] Correct Way To Add a Bottom Border Between Nav Items?</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/26799/MBM">MBM</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24476/footer-div-at-the-bottom-of-the-pagee-">[Solved] Footer Div at the bottom of the pagee.</a>
</h2>
<div>
<span>4 comments</span>
<span>Most recent by <a href="/forums/profile/42401/scene1">scene1</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24478/consistent-icon-font-spacing-throughout-browsersos">Consistent icon font spacing throughout browsers/os</a>
</h2>
<div>
<span>7 comments</span>
<span>Most recent by <a href="/forums/profile/14783/chrisburton">chrisburton</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/11691/wordpress-plug-in-to-rotate-background-images">Wordpress plug-in to rotate background images</a>
</h2>
<div>
<span>6 comments</span>
<span>Most recent by <a href="/forums/profile/39081/AlenAbdula">AlenAbdula</a></span>
<span>April 27</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24472/how-to-redirect-if-one-is-logged-in-or-not">how to redirect if one is logged in or not</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/37897/srig99">srig99</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24474/javascript-click-but-no-reaction-">JavaScript - click but no reaction :(</a>
</h2>
<div>
<span>4 comments</span>
<span>Most recent by <a href="/forums/profile/36743/whodunit">whodunit</a></span>
<span>April 27</span><span><a href="/forums/categories/javascript">JavaScript Jungle</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24475/center-arrow-on-hover-menunav">Center Arrow On Hover Menu/Nav</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/39336/mwbcomputers">mwbcomputers</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24470/creating-a-navbar-questions">Creating a Navbar Questions</a>
</h2>
<div>
<span>3 comments</span>
<span>Most recent by <a href="/forums/profile/42148/deeve007">deeve007</a></span>
<span>April 27</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24454/make-role-see-and-edit-specific-pages-wordpress">Make role see and edit specific pages WORDPRESS</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/38082/bastunqk">bastunqk</a></span>
<span>April 27</span><span><a href="/forums/categories/php">PHP Problems</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24442/free-font-similar-to-segoe-ui">[Solved] Free Font Similar to Segoe UI</a>
</h2>
<div>
<span>6 comments</span>
<span>Most recent by <a href="/forums/profile/14783/chrisburton">chrisburton</a></span>
<span>April 27</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24471/client-wants-to-edit-their-site-in-dreamweaver">Client wants to edit their site in Dreamweaver</a>
</h2>
<div>
<span>2 comments</span>
<span>Most recent by <a href="/forums/profile/21173/Paulie_D">Paulie_D</a></span>
<span>April 27</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24466/loading-image-wont-display-on-some-pages">Loading image wont display on some pages</a>
</h2>
<div>
<span>11 comments</span>
<span>Most recent by <a href="/forums/profile/37543/Jarolin">Jarolin</a></span>
<span>April 26</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24446/issue-with-inner-div-that-sets-a-20px-padding-inside-parent-div">Issue with "Inner" div that sets a 20px Padding inside parent div</a>
</h2>
<div>
<span>11 comments</span>
<span>Most recent by <a href="/forums/profile/38581/CrocoDillon">CrocoDillon</a></span>
<span>April 26</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24467/mobile-menu-slide-from-top-or-off-canvas-from-left">Mobile menu, slide from top, or off canvas from left?</a>
</h2>
<div>
<span>1 comment</span>
<span>Started by <a href="/forums/profile/42148/deeve007">deeve007</a></span>
<span>April 26</span><span><a href="/forums/categories/css">CSS Combat</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24430/supported-devices-for-rwd">Supported devices for RWD</a>
</h2>
<div>
<span>13 comments</span>
<span>Most recent by <a href="/forums/profile/41069/will_wallace85">will_wallace85</a></span>
<span>April 26</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
<li>
<div>
<h2>
<a href="/forums/discussion/24463/brainfilter-tv-updated-need-feedback">brainfilter.tv updated -- need feedback</a>
</h2>
<div>
<span>11 comments</span>
<span>Most recent by <a href="/forums/profile/14783/chrisburton">chrisburton</a></span>
<span>April 26</span><span><a href="/forums/categories/other">Other Discussions</a></span>
</div>
</div>
</li>
</ul>
<div>
<div id="PagerBefore">
<a href="/forums/discussions/p26">‹</a>
<a href="/forums/discussions/p1">1</a>
<span>…</span>
<a href="/forums/discussions/p24">24</a>
<a href="/forums/discussions/p25">25</a>
<a href="/forums/discussions/p26">26</a>
<a href="/forums/discussions/p27">27</a>
<a href="/forums/discussions/p28">28</a>
<a href="/forums/discussions/p29">29</a>
<a href="/forums/discussions/p30">30</a>
<span>…</span>
<a href="/forums/discussions/p750">750</a>
<a href="/forums/discussions/p28">›</a>
</div>
</div>
</div>
<aside>
<div>
<h4>Howdy, Stranger!</h4>
<p>Get help, give help. Join our friendly community of web designers and developers.</p>
<div>
<a href="/forums/entry/signin">Sign In</a> <a href="/forums/entry/register">Join Now</a>
</div>
</div>
<a href="/forums/post/discussion">Start New Discussion</a>
<div class="categories">
<h4><a href="/forums/categories/all">Categories</a></h4>
<ul>
<li><span><strong><a href="/forums/discussions">All Discussions</a></strong></span><span>22,480</span>
</li>
<li><strong><a href="/forums/categories/css">CSS Combat</a></strong><span>11,320</span>
</li>
<li><strong><a href="/forums/categories/other">Other Discussions</a></strong><span>5,132</span>
</li>
<li><strong><a href="/forums/categories/javascript">JavaScript Jungle</a></strong><span>3,485</span>
</li>
<li><strong><a href="/forums/categories/php">PHP Problems</a></strong><span>2,543</span>
</li>
</ul>
</div>
</aside>
</div>
</div>
<footer>The CSS-Tricks forums are by the people, for the people. They are maintained by a group of excellent moderators. To get the most out of it, read <a href="http://css-tricks.com/how-to-ask-a-good-question-in-the-forums/">How To Ask a Good Question in the Forums</a> and make <a href="http://css-tricks.com/reduced-test-cases/">reduced test cases</a> on <a href="http://codepen.io/pen/">CodePen</a> to help other people understand your problem.</footer>
</body>
header {
position:absolute;
margin-top:-10em;
margin-left:-1em;
z-index:1;
}
header>div {
padding-top:5em;
padding-left:4em;
box-sizing:border-box;
width:25em;
height:15em;
}
#Body {
margin-top:10em;
z-index:100;
position:relative;
}
#main-nav {
display:-webkit-flex;
height:3em;
padding:0 1em;
-webkit-align-items:stretch;
-webkit-justify-content:center;
}
#main-nav>a {
display:-webkit-flex;
-webkit-align-items:center;
-webkit-justify-content:center;
-webkit-flex:1 0 0;
background-color:rgb(175, 175, 175);
box-shadow:rgba(0, 0, 0, 0.298039) 8px 0px 25px 2px;
}
#Content>.left>div:first-of-type {
padding-left:3em;
}
#Content>.left>div:first-of-type {
padding-top:1em;
padding-bottom:1em;
margin:1em 1em 0 1em;
}
#Content>.left>ul {
margin:0 1em 1em 1em;
}
#Content>.left>ul>li {
margin:0 1em 1em 0;
padding:1em 1em 1em 2em;
}
#Content>.left>ul>li h2 {
padding-bottom:.25em;
}
#Content {
display:-webkit-flex;
display:flex;
flex-wrap:wrap;
-webkit-flex-flow:row;
-webkit-justify-content:center;
}
#Content>.left {
-webkit-flex:2 0 0;
flex:2 0 0;
min-width:400px;
}
#Content>aside {
-webkit-flex:1 0 0;
-webkit-flex-flow:column nowrap;
-webkit-justify-content:center;
margin:1em 1em 1em 0;
}
#Content>aside>* {
-webkit-flex:1 1 auto;
padding:1em;
box-shadow:lightgrey 0px 0px 3px 2px;
}
#Content>aside>a {
display:block;
margin:1em 0;
}
#Content>aside>div:first-of-type h4 {
font-weight:bold;
margin-bottom:.25em;
}
aside>.categories>ul>li {
display:-webkit-flex;
-webkit-flex-flow:row nowrap;
-webkit-justify-content:flex-start;
}
aside>.categories>ul>li:nth-of-type(n+2) {
margin-top:1em;
}
aside>.categories>ul>li>span:first-of-type {
-webkit-flex:1 0 auto;
}
aside>.categories>ul>li>span:nth-child(2) {
-webkit-flex:0 1 auto;
margin-left:auto;
}
#Content>aside>div:first-of-type p {
line-height:1.4em;
}
#Content>aside>div:first-of-type>div>a {
display:inline-block;
border:0;
border-radius:0;
outline:0;
background:#4e68c7;
box-shadow:1px 0px 1px #203891, 0px 1px 1px #3852b1, 2px 1px 1px #203891, 1px 2px 1px #3852b1, 3px 2px 1px #203891, 2px 3px 1px #3852b1, 4px 3px 1px #203891, 3px 4px 1px #3852b1, 5px 4px 1px #203891, 4px 5px 1px #3852b1, 6px 5px 1px #203891;
color:white;
white-space:nowrap;
font-family:"Gotham Rounded A", "Gotham Rounded B", "proxima-nova-soft", sans-serif;
padding:9px 16px;
line-height:1.4;
margin-top:.25em;
}
#Content>aside>a {
background:#799972;
text-align:center;
box-shadow:1px 0px 1px #4a6045, 0px 1px 1px #617d5b, 2px 1px 1px #4a6045, 1px 2px 1px #617d5b, 3px 2px 1px #4a6045, 2px 3px 1px #617d5b, 4px 3px 1px #4a6045, 3px 4px 1px #617d5b, 5px 4px 1px #4a6045, 4px 5px 1px #617d5b, 6px 5px 1px #4a6045;
}
aside>.categories>h4 {
font-weight:bold;
padding:1em 0;
}
aside>.categories strong a {
font-weight:bold;
color:rgb(133, 156, 230);
}
body {
font-family:verdana, sans-serif;
color:#333333;
background-color:#222222;
margin:1em;
}
a {
text-decoration:none;
color:#333333;
}
#Content, #Body {
background-color:rgb(255, 230, 197);
}
#main-nav {
background-color:rgb(214, 213, 213);
}
#Content>.left>div:first-of-type, #Content>.left>ul {
background-color:white;
}
header>div {
background-color:rgb(225, 135, 40);
}
header>div>a {
text-transform:uppercase;
font-size:3em;
}
header>div>a>span {
color:#eeeeee;
}
#main-nav>a {
text-transform:uppercase;
}
#Content>.left h1 {
font-size:2em;
font-weight:bold;
}
#Content>.left>ul>li {
background-color:rgb(245, 245, 245);
}
#Content>.left>ul>li>div>h2 {
font-weight:bold;
}
#Content>.left>ul>li>div>div * {
color:rgb(153, 153, 153);
font-size:.85em;
}
#PagerBefore {
background-color:#222222;
display:-webkit-flex;
-webkit-justify-content:space-around;
max-width:400px;
margin:1em auto;
padding:1em;
}
#PagerBefore * {
color:#eeeeee;
}
aside>* {
background-color:white;
}
footer {
color:rgb(149, 153, 153);
padding:1em;
}
footer a {
color:rgb(133, 148, 212);
}