402 Posted Topics
 | Re: Tight CSS It's always good to tightening up your assets. You can also automate this (minifying, concatenation and such) with a task runner like [Grunt](http://gruntjs.com/) or [Gulp](http://gulpjs.com/) before you deploy to a live server. These days people recommend to load your [critical CSS](https://www.smashingmagazine.com/2015/08/understanding-critical-css/) (the CSS that's needed for your content above the …  |
| | Re: jQuery UI I also thiink jQueryUI is dying slowly. If you want to rely on third party integrations then better go to a payed alternative such as [KendoUI](http://www.telerik.com/kendo-ui) or even the free [Dojo UI library](http://dojotoolkit.org/documentation/#widgets). It looks like the latter has still an active userbase, update cycle and support.  |
| | Regarding the new navigation menu when I want to click a link/button that's at the top of the page I can't, because the navigation appears. You use opacity: 0 and on hover you set the opacity to 1 so that it appears. Perhaps it's a suggestion to show that navigation … |
 | Re: online shop It's because there's also an index.html in that 'bestshop' directory and that's the one that gets loaded when accessing www.advance-web-studio.com/bestshop/ http://www.advance-web-studio.com/bestshop/index.html As far as I know loads Apache by default an index.html before an index.php unless you tell otherwise (a diffrent order) in a .htaccess file. If you want to …  |
 | You can position elements with CSS wherever you want. The (html) source order of your elements does not has to be the same order visually. In your case the CSS `float`, `left` and `margin` properties positioned the main content and sidebars where you see them on the screen. It's usually … |
| | I'm trying to retrieve the values of checkboxes in a custom post type. My complete function: function getTeam() { global $post; $team = new WP_Query(); $team->query('post_type=coaches'); $workshops = get_field('workshops'); if ($team->found_posts > 0) { echo '<ul>'; while ($team->have_posts()) { $team->the_post(); $listTeam = '<li>'; $listTeam .= '<a href="#" class="js-modal">'; $listTeam .= … |
| | I'm not sure why it returns Array, because as far as I know I don't retrieve the profile images from an array. See the following function. function getTeam() { global $post; $team = new WP_Query(); $team->query('post_type=coaches'); if ($team->found_posts > 0) { echo '<ul>'; while ($team->have_posts()) { $team->the_post(); $listTeam = '<li>'; … |
| | Re: Google like? Or embed as an object into your pages with an iframe and a download link as fallbacks. <object data="/pdf/your-pdf.pdf" type="application/pdf" width="100%" height="100%"> <iframe src="/pdf/your-pdf.pdf" width="100%" height="100%" style="border: none;"> This browser does not support PDFs. Please download the PDF to view it: <a href="/pdf/your-pdf.pdf">Download PDF</a> </iframe> </object> There is also JavaScript … |
| | > Cek this out: http://gsa-constructionspecialist.com/experiences Wow! Those colours! ¯\_(ツ)_/¯ |
 | And perhaps it's a better idea to ask this at the Arduino forum to get a quicker answer, because I really had to google what Arduino was :) https://forum.arduino.cc/ |
| | Ok... back to my PHP/Wordpress adventure. In my testimonials post type I have added 5 custom fields and 2 fields are not mandatory which means they can be empty. One of them is the url field which I want to output within my while loop with a different HTML when …  |
| | Aight folks! So I'm trying to do some custom coding within Wordpress and my plan is to create custom post types which I want to display within custom widgets. I thought that would be fun for a learning experience.... ahum... and I wanted a widget/plugin that outputs some proper semantic … |
| | You use the checkbox hack and what I know is that pseudo-class + general (`+`) / adjacent (`~`) sibling combinators doesn't work on Android below 4.1.2. but there is a solution for that. body { -webkit-animation: bugfix infinite 1s; } @-webkit-keyframes bugfix { from {padding:0;} to {padding:0;} } I've used … |
| | > Is that the only way? And the fastest way is to code it with bootstrap? I remember from previous threads that when you even use Bootstrap to create responsive layouts it took you ages, so I'd recommend that you use a premade responsive (Bootstrap) theme/template and change the text … |
 | You have this `<?phpinclude 'includes/header.php'/?> ` which should be this `<?php include 'includes/header.php'; ?> ` |
| | You probably don't need this webfont stuff. I've deleted thiose lines and it keeps on swinging :) lib.webFontTxtInst = {}; var loadedTypekitCount = 0; var loadedGoogleCount = 0; var gFontsUpdateCacheList = []; var tFontsUpdateCacheList = []; lib.ssMetadata = []; lib.updateListCache = function (cacheList) { for(var i = 0; i < … |
 | > What is the problem? Yes, I'm also curious what the problem is. I use Thunderbird too, but I didn't notice any 'problems'.  |
| | I checked on my Mac in Chrome and the slider just works. Perhaps they have some JS from a Chrome extension they've installed that's interfering with your JS. |
 | Nobody ever made or makes a `<list> <ul> <li>` menu not even in HTML4, but I guess you meant `<nav> <ul> <li>`. There is coming a `<menu> <menuitem>` but probably in HTML6... hehe |
 | There is a pure css solution if you use custom data-attributes. HTML: <ul> <li lang="es" data-lang="Nuestros jugadores representan una variedad de fondos, países e idiomas.">Español</li> <li lang="zh" data-lang="我們的球員代表了各種背景，國家和語言。">中文</li> </ul> CSS: ul { list-style: none; margin: 0; padding: 0; } li[data-lang] { margin-bottom: .5rem;; cursor: pointer; } li[data-lang]:hover::after { content: " … |
| | You can change/set the fill color of a path with CSS. .st0 { fill: blue; } You can also set the stroke color & width with CSS. .st0 { fill: blue; stroke: yellow; stroke-width: 2; } |
 | I use the @media print styles from HTML5 Boilerplate in my default CSS file. Perhaps it can come in handy for you too. /* ========================================================================== Print styles. Inlined to avoid the additional HTTP request: http://www.phpied.com/delay-loading-your-print-css/ ========================================================================== */ @media print { *, *:before, *:after, *:first-letter, *:first-line { background: transparent !important; color: … |
 | Ok... hold on! I'm on it!  |
 | Re: Opacity problem If you set an opacity to an element then that element and its child elements will get that opacity. So either set an opacity on that image in Photoshop or whatever photo editor you use or you can use a pseudo element `(::before` or `::after`) for that background-image and set … |
| | Try to give it a z-index, because it might behind the #container div which has a min-height of 100% and a white background color. This might be covering the header. #header1 { width: 100%; font-size: 28px; font-weight: bold; font-style: oblique; position: fixed; z-index: 100; } Just to be sure I … |
 | > I find the demand for responsive sites a waste of time - phones now have bigger screens, and if you turn them from portrait view to landscape, most non-responsive sites work okay! Not necessarily true! Have a look at any websites' Google Analytics and you will be surprised how … |
| | > Not sure if I'd want a site that looked like that! Indeed! That sites loads, performs and displays horrendous. Such a big architect agency with such a lousy site :) The one responsible for slapping that piece on the Internet had clearly no clue what he was doing. On … |
| | I've noticed the last couple of weeks that a hard-refresh won't clear the cache anymore in Chrome... well to me and two clients of mine (we're all on a Mac by the way). Not sure either if there was an update to Chrome recently which might cause this now. Did …  |
 | > Here is the full css code Those CSS blocks have nothing to do with the HTML of that image grid, so the error is not in there. You have a rule-set somewhere that might overriding that `margin-bottom`, because it should just work. See here; http://codepen.io/gentlemedia/pen/XNegPp With the browser developer … |
 | I have 3 dots :) http://codepen.io/gentlemedia/pen/MbEeOa |
| | In this case just float them, because you set fixed dimensions of 80px on them anyways so there's no need for using inline-block. |
| | That is not possible without using `flexbox`, `grid` or javascript. If you use `floats` or `inline-block`, you'll need to set dimensions. You can get half of what you want by using `calc()` :) http://codepen.io/gentlemedia/pen/qqjRpy And mixing `floats` and `inline-block` on the same element is redundant, because `inline` elements, such as … |
| | You can't have anchor tags within an anchor tag and think about it for a second... does it make sense? In order to show/hide the div while hovering the anchor, that div needs to be a sibiling of the anchor and not a child. Something like this: https://jsfiddle.net/gentlemedia/vc639va4/3/ |
 | I'd recommend to set the fridge image as a background-image to an HTML element such as a div that will have the same dimensions as the image. Then you can nest other div tags within that div for your shapes and position them with floats and margins or with flexbox …  |
| | You're getting way too specific with long selector chains like that which makes it imo harder to read and it will give you in the end specificity issues - https://css-tricks.com/specifics-on-css-specificity/ Also using ID's in your CSS is not recommended for specificity reasons too and the CSS applied to it is … |
| | For starter I'd recommend to take out the onclick attribute from the HTML. Keep structure and behavior seperate. <input id="aaa" formaction="register.php" type="submit" value="Register" /> And then within `<script>` tags document.getElementById('aaa').addEventListener('click', function (e) { e.preventDefault(); // scrollTo here }); or with jQuery $('#aaa').on('click', function (e) { e.preventDefault() // scrollTo here }) |
| | Shutterstock, Dreamtime, 123f and the likes do have them, but also http://www.freepik.com/free-photos-vectors/backdrop and perhaps at http://allthefreestock.com/ |
| | And on a side note and off topic. The `datetime` attribute is specifically for the `time` element. <time class="metro_tmtime" datetime="2013-04-10 18:30"> <span class="date">1/4/13</span> <span class="time">17:20</span> </time> https://schema.org/docs/gs.html#advanced_dates |
| | By default the arrows option is set to true, which means its shows the 'next' and 'prev' text links and not left & right arrows. Do you want left & right arrows instead of the text links, then you will have to put them in yourself either through CSS or … |
| | Wow... that is some ancient Dreamweaver way to mark-up a page. Not sure what you're after either, but if you want to override the default look of radio buttons (checked and unchecked) then you can do this with CSS, but looking at that mark-up it seems you've never heard of … |
 | Apple blocks autoplay of media (video or audio) in Safari on iOS by default and if you're going to use the `video` tag, then I'd recommend to convert your `.mov` file to `.mp4` instead, so that the video also plays in other browsers/devices. |
 | I think it has to do with the mobile navigation. If I resize the browser window to narrow to the point where your mobile navigation (hamburger icon) reveals, then a refresh doesn't shows the unstyled navigation flickr. Does the mobile navigation gets populated with JS somewhere? EDIT: I see there … |
 | I'm also not sure what you're after. You're talking about an iFrame, but have inserted a webview element into your HTML with an iFrame attribute. As far as I see (I'm not an Android developer) WebView is to load in an URL, but this goes via an XML layout file … |
| | I have the following which works fine for text inputs, textareas and selects with the class 'stored'. $(function() { $.each($('.stored'), function() { if(localStorage[$(this).attr('name')]) { $(this).val(localStorage[$(this).attr('name')]); } }); $('.stored').on('change', function() { localStorage[$(this).attr('name')] = $(this).val(), $(this).find('option:selected').val(); }); }); To store radio buttons or checkboxes with the class 'stored' in localStorage I've tried … |
| | You will need to wrap your submenu items in an ul tag as well. The way you have it now is not valid HTML either. Then you could combine `visibillity: hidden` and `opacity: 0` to hide and `visibility: visible` and `opacity: 1` to show on `:hover`. Sometime ago another member … |
| | I do see a slight hick-up in the animation too. It is slight, because there's nothing else that could influence the animation (like a design as a background). Why not animating with CSS transform2D (`transform: translateX()`) instead of the `left` property? CSS transforms use their own rendering layer and therefore … |
 | BrowserStack is great! It comes with a price, but it's worth it! https://www.browserstack.com/ |
 | Wow! DW and its extensions still spits out some messy HTML & CSS :) I see a fixed width and height in px as inline CSS, so like this it will never get responsive. Although I read on their site that the rotator can be responsive, but throught the GUI … |
| | I'm not into this, but you might want to have a look into Webgl. https://docs.webplatform.org/wiki/webgl https://www.chromeexperiments.com/webgl |
| | Re: Css height issue @rynatroop is right when setting a height of 100% on the container, then you should set a 100% height on the html and body tag too. Otherwise it takes 100% of 0 which is 0. To overcome this you can set the container height to 100vh which means it takes … |
The End.