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
2answers
51 views

How do I reverse a css export in Adobe Fireworks?

I have exported a fireworks .fw.png file to a .png and a .css file. I have lost the .fw.png files and the .css file has 200+ objects. Is there anyway to recreate the slices from the CSS code?
8
votes
4answers
6k views

How can I create this irregularly-shaped border with pure CSS (no images)?

I am trying to avoid using a background image (or any image-based solution) to effectively create this: Note: the red arrow is just pointing at the border in question. The arrow should not be ...
2
votes
3answers
201 views

“Darkening” a colour so that it's equivalent to the original when made transparent

When you make a colour partly transparent, it lightens (assuming it's on a white background), naturally. I would like to counter this behaviour by "darkening" a colour, so that when I make it ...
0
votes
1answer
527 views

How to work with image sprites in Photoshop?

I use CSS sprites to reduce server load and thus make the page load faster. This is very effective but I find managing these compound images difficult. I decided to use Photoshop slices to keep track ...
7
votes
3answers
3k views

Is it possible to create a kind of horizontal “invert mask” in CSS?

I have two blocks (div elements) with one black on the top background-color: black and one white on the bottom. Is it possible to have a piece of text that straddles the two zones with inverted ...
3
votes
2answers
170 views

Implement non-symmetrical background image to a site

I am trying to add the following 3D image as background to the content of a wordpress website: Click for full resolution Website I would like the header part to stay the same size on all pages, ...
0
votes
1answer
100 views

Graphic/web design approach to deal between UI design and front-end development

I have to search for a UI designer/front end developer to build my website out of a set of wireframes. I noticed this process is very fragmented due to complexity. What would be the best approach? ...
2
votes
4answers
197 views

Can I use CSS spritesheets to give a div a re-sizable background?

I'm trying to give a div a background according to a spritesheet, meaning that it'll define the parts from the sprite sheet and use those accordingly in the div. This is my sprite sheet image: Now ...
4
votes
1answer
135 views

Is there any negative adverse effect to optimizing images for retina screens, if the images aren't exactly double size?

For example: Say I have an image that is going to be displayed at 1000px wide. I want to optimize my site for retina displays, but the largest resolution image I have to put here is only 1900pixel ...
4
votes
2answers
318 views

Steps between Wireframe / UI design for web development

Based on my sketch/wireframe prepared for a UI designer (links below): Link: http://postimg.org/image/npt5zlvu7/ 1) Would I be able to approach a UI designer with the wireframe/sketch above? 2) ...
0
votes
1answer
819 views

12 or 16 column grid for a full width website? [duplicate]

So I'm looking for the right answer for my grid system: 1) Should I use 12 or 16 column grid for a full width website similar to these websites: http://xfinitytv.comcast.net http://www.vevo.com 2) ...
1
vote
2answers
205 views

How does the grid system work for a full width page?

How does the grid system work for those websites that expand to the full size of the browser (no matter how you resize) while working with a base 12 grid system (such as 960.gs)? For example, take a ...
3
votes
2answers
127 views

Adjusting diacritic in italicized combining character?

I'm trying to render an italicized lowercase omega (ω) with an inverted breve ( ̑ ) in a webpage using Times New Roman. I'm using the combining character approach: ̑ ( ̑ ) and ...
0
votes
1answer
795 views

How can I use CSS to make something look “pushed”?

I'm building a new website in Dreamweaver CS5 and I've made a default spry menu bar. Now I want that the menu bar has an 3D look. When you click the button on the menu bar, I would like an effect that ...
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
203 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?
3
votes
2answers
206 views

How to visually display css blocks for debugging

After lots of confusion and wasted effort I once learned that css also had this lines concept that everything else followed regardless of it being text or not. And that each line can be varied, be of ...
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 ...
6
votes
5answers
4k views

Is there a visual web editor based on bootstrap?

Bootstrap is a great framework, and I want know if there is a tool that gives you the possibility of dragging html components, re-sizing and moving them, changing colours, all while generating the ...
2
votes
1answer
102 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
258 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 ...
0
votes
3answers
242 views

Svg transparencies don't work as CSS background

I made a translucent svg. It was a 50% opacity round metal texture. When I put it above any other color it makes it look like real metal. It was made using Illustrator and had 2 of its effects: ...
2
votes
3answers
312 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 ...
-6
votes
1answer
2k views

How to make a site attractive? [closed]

What are the basics of an attractive web design? What should I be looking for and what sources should I use to educate myself on the matter?
0
votes
3answers
203 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
833 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.
16
votes
10answers
11k views

Do web frameworks such as Bootstrap or HTML5 boilerplate offer anything to a designer (not developer)?

Note, this is about design much more than development. I build sites from scratch with completely hand written CSS and HTML. I've known about pre-build css templates such as Bootstrap or HTML5 ...
3
votes
2answers
262 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 ...
-3
votes
1answer
408 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?:
1
vote
1answer
348 views

Where can I find a good repository of semi-transparent tiles for web?

I have been looking frequently for a site, a service that provides a repository of semi-transparent tiling backgrounds. I've found some grain generators, but I would like some more things that I could ...
2
votes
2answers
310 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
222 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 ...
1
vote
1answer
304 views

In Dreamweaver (or HTML and CSS in general) how can you style the ® Registered mark to be smaller and floating upwards?

On the web, using ® (&#174; or &reg;) will make the Registered mark almost as big as the rest of the text. How can you modify the size of it to match how it would appear in print?
3
votes
4answers
204 views

Positioning a DIV before the previous DIV

I'm not savvy when it comes to HTML/CSS. I use Typepad for my blog, and that limits me a lot. There are four divs. <div id="container-inner"> <div id="nav"></div> <div ...
4
votes
1answer
98 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 ...
2
votes
3answers
412 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
2answers
445 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: ...
2
votes
3answers
278 views

How do so many app menus get that finished textured look?

I don't know how to describe it but how do you create that nice textured look with css? Seen in the background: Also seen a bit on the left hand dark navigation of: Thanks for your help ...
-3
votes
3answers
163 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 ...
1
vote
2answers
727 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 ...
0
votes
1answer
2k 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 ...
10
votes
3answers
783 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 ...
4
votes
2answers
6k 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 ...
5
votes
1answer
128 views

How do you build a webpage with a main text body and 2 columns underneath?

I have a body of text that I am trying to layout in a visually pleasing way but I can not figure it out. The goal is to have this layout (see psuedocode): <container> <main /> ...
4
votes
2answers
987 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 ...
2
votes
2answers
4k 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 ...
4
votes
1answer
805 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
719 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
785 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
535 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 ...