Questions about cascading style sheets, commonly refered to as CSS. Ask anything related to implementing styles, effects or graphic-design-specific tasks. For questions about implementing structural elements or anything completely unrelated to the aesthetic look, please go to Stack Overflow.

learn more… | top users | synonyms

2
votes
6answers
296 views

Is there a name for buttons with a thick shadow underneath?

I have been seeing a lot of these buttons lately. I think it's a recent trend. I would just like to know the name for it so I can explore them further. In this sprite image, the buttons on the bottom ...
6
votes
4answers
3k views

What is the ideal number of font sizes to use for a website?

I'd like to know how many font sizes can you use for a website. Someone said to me it's better not to use more than 3 different font sizes (e.g. 16px for heading, 11px for text and 13 px for smaller ...
1
vote
1answer
224 views

Adding curved drop shadows using Gimp

I was going through a few website designs and I really liked this pointed corner drop shadow: How can I add similar shadow effect using The Gimp or simple CSS?
6
votes
3answers
2k views

Vertical rhythm/baseline grid in Web Design

I recently read some articles about the importance of good vertical rhythm/using a baseline grid for good typography in web design. I decided to try using a baseline grid, like the 960 grid pictured ...
6
votes
3answers
1k views

How to give a site a mockup look?

Edit to clarify Thank you for the existing answers. I am afraid that you misunderstood my question. I don't want to create mockups (I have some, but they are not suited for my current purpose). I want ...
2
votes
1answer
111 views

What's the meaning of saying CSS sprites are “for graphics that are just single blocks”?

I was reading this to understand sprites http://css-tricks.com/css-sprites/ The author says "Sprites are for graphics that are just single blocks. " What does this mean? One thing I have read is to ...
3
votes
2answers
355 views

How to make a “highlighter” effect for text background in CSS?

How would I go about highlighting an inline part of a paragraph decorated with a "highlighted" effect as if it were marked by a real highlighter on paper. <p> The dog <em>jumped ...
2
votes
3answers
346 views

How to design a modern/slightly futuristic-looking application

I was hoping to get some advice from some more experienced UI developers. I have been presented with a unique challenge by my customer, and I feel like I am failing. Specifically, they want a UI that ...
0
votes
1answer
217 views

How can I achieve a better 3D lifting effect of a logo for a website?

This is my current approach, only the shadow moves. http://tinkerbin.com/uekpe227 This is a second approach, both the shadow and the letters move. http://tinkerbin.com/LjiGDKa7 And in the last ...
-3
votes
1answer
474 views

How to create a vertically asymmetrical grid in Photoshop

I'm working on a site. The width will be fixed, but the length will vary. What would be the best way to create a grid like the following in Photoshop?:
2
votes
5answers
6k views

Fluid Images: How to set width and height?

I'm trying to build a fluid layout, for which I am styling big images with: .fluid_img { height: auto; width: auto; max-width: 100%; } This works fine, the problem is that I can no longer use ...
6
votes
4answers
3k views

Gutters - Padding and Margin for Columns with Background or Border

What are the recommended design guidelines for gutters when a column (or box, or any layout module) has its shape clearly visible because it has its own background or border? Typically one would put ...
0
votes
3answers
265 views

What is a difference in Css frameworks vs preprocessors

I am somewhat confused as a graphic designer. What is that distinguish them. I know what both provide to some extent. Like I read about LESS and liked it. I guess i want to know what is a difference ...
-1
votes
1answer
914 views

Right css code to align(center) the div tag? [closed]

I googled this question and searched for an hour, every one specify their own likes, but i want to know the correct code to align the div in center position.
2
votes
5answers
233 views

Recommendation to learn css [closed]

How would you recommend to proceed to learn css? Is there a great book, or online tutorial?
3
votes
2answers
355 views

Text wrapping fill-last-line-first

I have a peculiar design for a web page that I have to implement from an already made design, and some of the text wrappings are filled bottom-up (in my case it's for bottom-left aligned thin text ...
2
votes
2answers
380 views

How can you get decorative dots or dashes between links in the sitemap hierarchy, using either CSS or images?

In the footer of my clients site, I want to give the users total clarity about where things are on the website so that they can quickly navigate there. So I will implement what looks like a nested ...
2
votes
2answers
260 views

Layout with Tables - Hierarchy

In this fiddle there's a markup and style I'm doing for a website: http://jsfiddle.net/UvJmP/ I am trying to represent data in this way: D2's table data is contained in D1 D3's table data is ...
4
votes
1answer
103 views

Are custom graphics/images a necessity for professional looking web design?

I learned css snd html, thinking that making a site that looks good and professional would be a simple matter of basic layout and some fiddling with colours/text. However on beginning the css portion ...
0
votes
1answer
3k views

Does Firefox support .ttc fonts? [closed]

I have the following css: @font-face { font-family: 'font name'; src: url('../font/fontname.ttc'); } In Chrome it is working but in the firefox the font style doesn't apply, font get too bold not ...
2
votes
3answers
480 views

How to extract the black and white components of an image to superimpose it over colored backgrounds

Say I want to create a glowing button for a website. I would like to have the possibility to dynamically change the color of that button by changing the color of it's background. For this I need to ...
-3
votes
3answers
164 views

What is that flash can do but css3 cant do [closed]

I am not asking to prove what is better, and since this is a forum for graphic Designers..i would like to have a list of limits and possibilities. For example, in flash if i wanted to make the whole ...
3
votes
2answers
476 views

How to recreate this background in photoshop for use in a mobile app? [duplicate]

Possible Duplicate: How do so many app menus get that finished textured look? I'm still a beginner, but I really like this texture and have been trying for hours to recreate it. Question: ...
3
votes
2answers
6k views

How do I use a custom font in an SVG image on my site?

I created a custom Facebook icon using Inkscape and saved it as an svg. It uses the same font as the title of my page, which uses the font "ubuntutitling-bold-webfont", which I have referenced as a ...
1
vote
2answers
848 views

How to get arced drop shadows with center glow effect in Photoshop?

I was just browsing the plugins.joshlobe.com and the thing that caught my eye was interesting use of drop shadows. I am talking about the drop shadow in the linked image with a center glow kind of ...
2
votes
4answers
10k views

Change the color of an image in a website

I have this image in my website, is a png: I want to know if there is any way with HTML5, javascript or css to change the color of the image. Or at least make the image change to white (invert ...
1
vote
3answers
2k views

Photoshop kern and css kern ratio?

I am trying to determine the how much line spacing to set for the amount of kern used in photoshop. I can eye-ball the spacing but does anyone know the exact ratio between the two. ex. Set text kern ...
10
votes
3answers
993 views

Should underline clash with text descenders?

CSS3’s text-decoration module includes a text-underline-position property, which specifies whether the underline should be positioned below the whole text:            or just below baseline, letting ...
2
votes
2answers
233 views

How good is the fonts.com webfont solution compared to the current @font-face standard?

I guess the title says it all. I've been successfully working with @font-face (with near-perfect cross-browser support, if you use all the hacks). However, a client really wants to use Helvetica, and ...
5
votes
2answers
7k views

How to control word-spacing in justified text with CSS?

I have 2 blocks of text that are pretty small (just under a paragraph each) and they really look better justified but the problem is that text-align: justify; sometimes adds really large spaces and ...
4
votes
2answers
1k views

How can I slice parallelogram shapes to HTML/CSS?

I have to slice website design to HTML/CSS. Main navigation menu looks like below: I am beginner webdeveloper and I don't know how to slice this design into compatible and cross-browser code. How ...
4
votes
2answers
1k views

Looking for suggestions for making type more readable with a drop shadow

I want to show a menu with indented items on top of a black background. I tried a lot of colors but can't find the right ones. I'm using css property text-shadow: text-shadow: 1px 1px #191919 , -1px ...
1
vote
2answers
281 views

How do you achieve the margin:auto effect in Fireworks/Photoshop?

In Fireworks and for an image similar to this: what's the best way to horizontally distribute objects in their parent container so that they have equal margins? The same effect can be achieved with ...
1
vote
1answer
222 views

Creating a new stage in Adobe Edge Preview 0.10.0.134.17040

I recently started working with Adobe Edge, and need to create an additional stage for a more complex animation. How can this be done?
4
votes
1answer
940 views

Museo Font get distorted in browser

I am facing some problems with font rendering in different browsers. I tried to add a custom font and font get distorted in browser like firefox, chrome, IE ...
2
votes
2answers
794 views

Why does Google want a vertical scrollbar on search page when it's not necessary

On Google's search page there is a visible vertical scroll bar even when it is not necessary. This can be avoided by deleting the following style from body selector overflow-y: scroll; When this ...
1
vote
2answers
870 views

How to create buttons with editable text that are re sizable (to accommodate longer/shorter text) on all browsers [closed]

I often find that I need to change the text on buttons. I'd like to create some CSS based editable buttons with mouse over effects. And the whole button should be clickable (not just the text). I ...
1
vote
2answers
567 views

CSS LetterPress Effect

I can't seem to get the color values/names correct so that I can get a Letter Press Effect on the text To create the appearance of text that has been stamped, choose a text colour that is darker ...
0
votes
2answers
232 views

How can I improve my website design? [closed]

I'm launching a company and currently working on the website. Here is the link: http://goo.gl/HKbIK As I'm not a professional webdesigner your comments / feedback / suggestions of improvements would ...
0
votes
2answers
188 views

Advice on typography and background image

I have a blog and i would like to ask anyone CSS savvy for advice on some changes. http://fornuftfu.se/category/blogg/ Better Typography for the blog articles Is the design too dull? Would a ...
1
vote
3answers
258 views

Element naming conventions / inspiration [closed]

I work in front end markup so I'm constantly templating site. Does anyone know of good resources to learn some good conventions or inspiration for element names? I like names that relate to print ...
2
votes
2answers
179 views

Is there a way to get the equivalent of a color in different blending modes?

I have to make a button with some shadows using HTML/CSS and I've been provided with a PSD file, which has a shape of the button and some effects applied to it. One of the effects is an inner shadow. ...
0
votes
1answer
306 views

Images not displaying properly in Firefox

I am having an issue with Firefox rendering a few of the .png's that I have loaded into a Wordpress blog that I am preparing for a client. The images look fine in IE 8 & 9, and chrome, but it ...
0
votes
1answer
2k views

Color palettes - RAL to hex or RGB

I'm looking for a way to transform the RAL color palette to hex or RGB so I can use the colors in CSS (all/any of them). Is there an XML file someone can point me to, or a database somewhere, that's ...
2
votes
1answer
157 views

Spacing nav menu type

When designing a horizontal menu for a website in photoshop (like the img attahced) whats the best way to space them ? In html/css i would just use float:right; margin-left:20px; but in photoshop the ...
2
votes
2answers
141 views

Is there any way to lock down Photoshop to prevent designers from creating styles that cannot be rendered in CSS?

Photoshop is a much more powerful design tool than CSS, and given free reign to design at will, designers will often tweak things like font settings to a degree that cannot be recreated on the web. ...
1
vote
2answers
719 views

Creating Rolodex-Style Flipping Numbers Sprite in Photoshop?

So Apple recently had a countdown to their 1 billionth app download and it used a rolodex flipping type of effect. This actually turned out to be running on a sprite image which is composed of ...
5
votes
4answers
16k views

Clean, simple CSS styles for text and table-heavy sites

I just want some basic, clean-looking CSS styles to apply to a site of mine that's a web application with lots of forms and tables. Anyone have a theme or a set of CSS or a site I can look at to ...
0
votes
1answer
265 views

DIfference between IE and FF. Colors [closed]

I have a problem with my CSS code. Buttons look differently in IE7 and FF Here are my buttons: Here is my code: .list-common-wrapper .button-unfixed .button-unfixed-normal[disabled] ...
3
votes
7answers
3k views

PSD fonts and Html Page fonts

I am a web developer. What happens is that the Client sends a PSD (Photoshop designs) to the company. Then the designer needs to create a HTML page from the PSDs What happen every time is that the ...