CSS Archives | Perficient Digital
Posts Tagged with CSS

Creating Your First Custom AEM Component Using React – Part 1

Recently, I went through an article about integrating React JS and Angular JS with AEM. In this blog, I am going to show you how to create a custom component that includes a cq:dialog and one that does not include a cq:dialog. Before building the components, clone the repository, which is a sample project based […]

Read more

Solved with CSS: Image Captions Done Right

There is a problem with the default styling of the figure caption (figcaption) element that is intrinsic to the way HTML and CSS work on their simplest level.  Elements don’t know or care about the other elements around them; they behave in their own way, no matter what content comes before or after them.  Let’s […]

Read more

Using BEM-Style CSS Syntax in SCSS

Modular component styles are becoming significantly important in modern UI trends. Handling scalability while decreasing naming convention differences is a necessary step towards code cohesion. Disclaimer: I use a slightly modified flavor of BEM syntax, feel free to use traditional BEM, or some other flavor of your own. When developing UI components, specifically for use […]

Read more

How to Force AEM to Not Process CSS URLs

By default, AEM CSS processor will transform the CSS URL functional notation “url()” into a relative URL to the ClientLibrary, if the URL was relative to begin with, ie, it does not start with “/” This poses an issue when using the CSS fill property for SVG and providing a gradient id (read more here) The following was […]

Read more

#AdobeSummit Standout: PhoneGap and Framework7 for Mobile Apps

We’ve seen many innovative features and products launched at Adobe Summit 2017. As a developer, one cool feature that attracted me the most was the development of a hybrid mobile application with PhoneGap along with Framework7 open source UI framework. When developing a mobile application using JavaScript, CSS and native libraries, I have faced issues with […]

Read more

Web Fonts – To Use, or Not to Use

Ever stumbled upon an article on social media that catches your interest? You click it. You are curious and anxious to read it. You are in the website – it loads, but at first, it seems empty. The site is there, but there is no text in it. You are probably annoyed. You are probably […]

Read more

Houdini – A New Development in CSS

We know the frustration all too well… The goal is to build websites and web applications that are cross-browser compatible and provide a similar experience across the board. Unfortunately, when new CSS functionality comes out, we get stuck between having to wait for browsers to adopt it in unison, which can take a few years or […]

Read more

CSS Pixel Ratio (or “How Big is My Phone?”)

When designing and developing a website for mobile devices, there are many things one needs to consider. Are you using a responsive or adaptive approach? What devices / browsers should be supported? What are the major breakpoints? When trying to answer these questions, we as designers and developers tend to focus on mobile device resolutions […]

Read more
Showing Off Their CSS

Showing Off Their CSS

In the past few weeks, I’ve seen no less than five different companies publish an article documenting their internal CSS frameworks; it’s a fascinating pattern.  Getting an inside look at how other people (or companies) are organizing code and what tools they are using is a pretty fantastic way to become a better developer yourself.  […]

Read more

Myths & Facts – Websphere Portal and UI.

Having worked as a front end developer, integrating the UI with backend systems, I am presenting below some of the myths and facts concerning UI (html, css, javascript, images, fonts) code integration with websphere portal and a few best practices one should follow – Myth – Websphere portal is not compatible with latest front end frameworks like […]

Read more