Key Words & Phrases Flex Container -Parent element in which flex item are located in Flex item -The child of a flex container (the parent). Direction -Leftwards -Rightwards -Downwards -Upwards What Are Flexible Box/Flex Box Flexible Box/Flex Box is a box model optimized for interface design in CSS3. One of the major pros of flexible [...]
|
Tweet to @xcss3x
|
|
|
On 11.12.12, In blogs, design, Design, User Interface Design, User Science, Usability, mobile, by AustinThemes
In an increasingly mobile world, the modern website is akin to an actor trying to play many parts, for many audiences. Website are no longer just a fixed or full-width box on one device, but now need to accomodate several different screen and device sizes, in addition to at least 4 different traditional web browsers. [...]
On 10.17.12, In BLOGGING, by Sergio Jasinski
Are you concerned about your WordPress site security, but aren’t sure if your hosting company has your back? WordPress requires its own security protocol that many “Shared” hosts won’t manage for you. With many hosts, you’re on your own to make sure your site is secure, much less loads quickly and is scalable. That’s part [...]
Today we want to share a simple parallax content slider with you. Using CSS animations, we’ll control the animation of each single element in the slider and create a parallax effect by animating the background of the slider itself. The idea for this comes from the slider of the Kendo UI homepage, a framework for [...]
One of the easiest and most effective ways of speeding up a web site is to replace background images with CSS3. A linear gradient defines a color change along a specified line. Each point on the line has a particular color. The width of the line, perpendicular to the direction of the line, extends to [...]
The CSS3 Selectors module introduces three new attribute selectors, which are grouped together under the heading “Substring Matching Attribute Selectors”. These new selectors are as follows: [att^=val] – the “begins with” selector The “begins with” selector allows for the selection of elements where a specified attribute (e.g. the href attribute of a hyperlink) begins with [...]
On 08.03.12, In BLOGGING, by Sergio Jasinski
The Problem Web development has become a bit more complicated, now that more and more people access the Internet using their tablets, smartphones and other mobile devices. Gone are the simple days of fixed-width web page layouts, and the messy stop-gap innovation that resulted from this — using tables as layout devices. Liquid layouts soon [...]
The most notable difference among all of the tutorials that I have seen, is the depth and complexity at which they portray their information. I like an article that is done at a high level, but has further information diving into technical pieces that I may or may not need to know. I don’t want [...]
Creating a responsive theme has become more and more prominent as the mobile world has started to take over the digital marketplace. Companies need to take into account the tablet and mobile phone world because people are beginning to make purchases from them. Whether you are marketing groceries, apps, or metal, it is important to [...]
CSS3 Gradients are a huge bonus to cutting edge browsers. They help eliminate the need for image editing programs for elements like buttons. If you are having trouble developing a gradient, look at this online css3 gradient generator. A BOX OF GRADIENTS background: -webkit-gradient(linear, 0 0, 0 100%, from(red), to(blue)); What type of gradient? (linear) [...]
There is a specific article on CSS3.info that I wanted to cover. It involves CSS3 transitions and how to stack and combine transitions. The transition-timing-function property is used to specify how the pace of the transition changes over its duration. This can be done in one of two ways. Either by specifying a number of [...]
As I was scrolling through my Google reader, I ran across a neat application called Animatable. The application has not been launched to the public yet, but the core concept is easily understood from its landing page. “Create, serve and track HTML5/CSS3 animations for desktop, Android, Blackberry QNX, iOS and WebOS mobile devices.” In essence [...]
CSS3 Generator.com is a pretty intuitive tool. It allows you to prototype ideas with CSS3 without actually needing any coding experience. The precision and accuracy of the tool have been confirmed. I was worried when it was giving me cross browser compatibility compliance, but after verifying with the CSS standards and practical testing, everything that [...]
Sergio had sent me a very impressive link that had helped him out a few weeks back. How do you submit multiple forms with jQuery and Ajax? Well if you think about Facebook for a minute, each box that you are posting to is an instance of a form. This means that there needs the [...]
CSS3 is changing how we build websites. Javascript and images are being replaced with CSS3 animations and properties. What was once required to be an image is now built in CSS3. One of the best examples of this is the rounded corners on menus or buttons. The ability for CSS3 and cross browser compatibility is [...]
Alright so I might have been a little biased on these decisions, but I went with websites that I have run across and felt they deserved to be pointed out. They offer a lot of unique CSS3 features and give a great user experience without sacrificing performance or site structure. Here are 9 awe inspiring css3 websites [...]
Hello World! So after the last tutorial on styling our menu, we are going to look into animations involving CSS3. We are going to be applying the webkit animation properties to text elements inside of a specific div tag, but you can truly do this with any dom element on the page. This is what [...]
So you saw the button tutorial and thought to yourself how could I make this better? Well it would help if you could apply the same style to all aspects of your website giving off a consistent look and feel. So here I am to proudly present an outstanding new menu method with CSS3. The [...]
Pure CSS3 form styling is becoming more popular. It has its drawbacks, but the increased loading time from the traditional JS overlay is wasted tenths of seconds when talking about optimizing to maximize for your entire audience. Most forms are fairly straight forward and only utilize inputs and text areas rather than radios and check [...]
So you are looking at your PSD layout and thinking to yourself: “These buttons look sharp”. You start to cut them out of the template and realize something horrible! You are wasting kbs of loading time here. You are racking up tenths of a second and losing precious audiences around the globe! So you decide [...]