Tag Info

New answers tagged

3

By convention, most styling should be placed in the <body> element. But there is one important reason to apply styles to the <html> element itself: when you are setting the default font styles, in particular font-size. This is because the <html> tag is the root element, thus rem (root em unit) sizing is based on whatever is set for the ...


-1

you are supposed to apply styling to body tag. Like set the background color to white, set font, font color, font size etc. You should always use external style sheets. For better management and handling, you should use multiple style sheets. body { background-color: #56473 ; font-family: Arial; font-size: 1.3em; margin: 5px; or anything you want here.


2

No. Illustrator wouldn't know what to do with CSS and HTML.


0

I only have concern for the latest browsers, and pixel-perfect designs aren't a necessity. Then you're likely good-to-go. As long as you build to standards, there shouldn't be any huge surprises across browsers if you're only targeting the latest and greatest. Just don't depend entirely on any one CSS feature that isn't widely supported yet without ...


12

GIFs For most simple animations, a gif is often the best way to go, especially when they don't require much interaction, are as detailed as the illustration you linked and don't need to have a dynamic width (gifs, like any image, can be blurry at times if their widths is changed). The animation you linked could be just a gif and a transparent overlay to ...


0

I notice if you render the element containing your gradient with the GPU using transform:translateZ(0), it render smoother, not perfect, but smoother.


2

In my experience, when doing static animations (animations that are not intended for any interaction with the user) I found that what best worked for me was animating the illustrations in After Effects and after that exporting the final result to a .GIF file. This makes the animation absolutely browser-friendly and guarantees identical visualisation in any ...


2

Nowadays you can practically use any font you wish as a webfont by embedding the font into your CSS and website. Popular sites like Font Squirrel give you webfont kits ready to implement in your website, while other people go for online services like Google Fonts or Adobe Typekit, which allow you to embed popular fonts in your website with ease. In any ...


2

You might want to try the Ultimate CSS Gradient Generator. It allows you to create a gradient in an Adobe-like UI, including transparency, and outputs sextuple-redundant css so your gradient renders as nice as possible in any thinkable browser. Any features a browser doesn't support, it tries to degrade gracefully.


8

Skeuomorphism is really the opposite of flat design. Google's "Material Design" is merely their branding name for their specific interpretations of flat design. It's still flat design though. "FLat Design" was coined by Apple when they released iOS7. It caught on because it was the first term used, it could just have easily been called "Material Design" if ...


3

One you need to be aware of is how compatible certain elements of HTML, CSS, etc are with different browsers. Newer HTML5 elements (and even some bits of CSS3) don't work in some browsers, causing issues with areas of the design. You can check this by looking up many possible references (Mozilla Developer Network, CSStricks, CanIUse , w3schools (see also ...


6

Considering you are targeting only the latest browsers (at the moment of writing Chrome 37.x, Firefox 32.x, Internet Explorer 11 should cover main latest rendering engines), you can accomplish cross-browser compatibility fairly easily and for most cases - hack free, since all of the mentioned browsers support most of the newest HTML and CSS properties. A ...



Top 50 recent answers are included