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

7
votes
4answers
1k views

professional design of an extremely slim vertical menu

Ok, so I am a programmer and a complete disaster at web design. Untill now I have been able to produce "acceptable" looks with the help of frameworks like bootstrap, but I am stuck with a little side ...
0
votes
2answers
56 views

How to measure distance between text and element in Photoshop

I find measuring the distance between an element and text rather complicated. Cause I need to first know the biggest letter and measure the distance from that to the element. Then substract the ...
4
votes
7answers
1k views

How do you create a client website design mockup/image?

For all the graphic designers who do web design too: How do you produce client design mockups for review and then convert them into HTML/Wordpress etc? Are they created in Illustrator/Photoshop and ...
12
votes
2answers
6k views

What's the best way to animate an illustration for the web?

I have a couple of illustrations done in Illustrator and I am planing to animate it for a website that I am working on, I've heard of Create.js toolkit with flash, but is it the best way to go or is ...
-1
votes
0answers
17 views

How to put together a block of text and a gallery of thumbnails?

I'm having a practical question, and I would like to ask for help... I have this block of text on the left and I need a gallery of 3 images (thimbnails) be placed in a row on the right. Thing is, I ...
-1
votes
1answer
58 views

What does 'content: “\e61e”' mean in CSS?

Wonder what content:"\e61e" is in the .icon-trash:before class' CSS. I know that they use a font to make icons but I don't know what "\e61e" is? Any explanation? Thank you in advance.
4
votes
3answers
73 views

HSL instead of HSB in Photoshop CC 2015

I'm a front end developer and I'm having issues with Photoshop. I have the HSB value in the Color Picker but I can't use it, because I need ligthness instead of brightness for CSS purposes. That's a ...
2
votes
1answer
3k views

SVG images showing up blurry in Safari in any size smaller than 20 px

I am doing a mobile demo for the Ipad that we are demoing in Safari. I am using icons to get away from having to scale my images 3x. Problem is that any icons that I am using that are smaller than ...
5
votes
3answers
487 views

Changing icons or graphics based on user geographic location/language?

Inspired by this question on international police icon, I started to wonder If there is a reasonably simple way to replace an icon depending on browser language? ...and if anyone has come across ...
8
votes
2answers
580 views

Why does browser add bluish and brownish colors to a solid font color?

I'm wondering why my browser (Firefox) add blue tints on the right and brown tints on the left of a solid grey (#333333) font color as shown in the image below. Could somebody explain to me why ...
3
votes
2answers
63 views

Does Photoshop also pull HTML? Or just CSS?

Im new to the most recent version of Photoshop, it has a cool feature I discovered where it takes the CSS of your design and copy's/paste's the thing into an editor. Where would you arrange the HTML ...
3
votes
2answers
11k views

Is there a “generate CSS/HTML” feature or plugin in Sketch app

I have found a script that does exactly that (generates CSS and HTML for the layers and offers an option of exporting those in % values) and cuts the work for the web-dev in half for Photoshop. Now I ...
4
votes
1answer
71 views

How can I extract a layer's transformation matrix in Photoshop?

I have a smart object in Photoshop CC which has been carefully distorted using Photoshop's 'Transform → Distort' function. Photoshop presumably manages a transformation matrix for this layer, and I'm ...
0
votes
1answer
39 views

Possible to create 3d rotating foods?

I've been looking around but it's very tough to find information on how to create 3D rotating objects on the web. I am interested in creating 3D rotating pieces of food like fruits, etc. What is the ...
0
votes
2answers
143 views

How to make vector templates from CSS frameworks?

I am planning in creating a Illustrator/Sketch vector based template for the CSS framework UiKit. And I wonder how to do that. My first thought was to print to PDF and dissect it from there, but then ...
8
votes
5answers
9k views

what is the largest glyph width in Arial?

Im designing a DIV container that will contain some rows of text. Every row can contain 0 to 35 chars. I need to specify a fixed width for the div, but I cannot predict how "wide" the string can be. ...
0
votes
0answers
40 views

SVG showing as blank in html

I have the following SVG file , saved as XML , looks as follows: <?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build ...
-2
votes
3answers
17k views

How to convert PSD file to Html

I am learning Photoshop, does Photoshop generates HTML and CSS files, I am a web designer and I am figuring out to convert the .PSD file to Html Css.
8
votes
8answers
10k 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 ...
4
votes
4answers
1k views

Responsive web design is based on screen resolution or screen size?

for mobile devices the resolution is actually big, only screen size is small. based on that: For websites design, do we target screen resolution (e.g 1080x1920)? And for mobile apps. do we target ...
1
vote
3answers
347 views

How to create a PDF template and export as HTML/CSS?

I need a tool that allows me to design how a PDF file would look like in a web page. Something simple the image below, I would like to design using some visual tool, export to HTML/CSS and then just ...
0
votes
1answer
129 views

Why does Boostrap 3 use Helvetica Neue?

My understanding currently is: "Helvetica Neue" is Linotype font. That means it needs to be paid for and is not free to use. It is also a font that is not for web, it is for print. It will not render ...
0
votes
1answer
71 views

PSD to HTML/CSS ON PHP/MYSQL SCRIPT

I have an auction script that uses PHP/MYSQL. I'm not satisfied with the look and feel but like the the overall function. I was planning on having a graphic designer come up with PSD files to give the ...
1
vote
1answer
49 views

Images for a mobile

So I've been doing a bit of reading but I'm very confused. I'm quite new to mobile and I've mostly used css to achieve the look on my mobile app. The only image that's being used in the app is a logo ...
5
votes
4answers
15k views

Do I need to create my images at twice the pixel dimensions on a retina display?

I just got a new Macbook Pro with Retina and I'm confused about how to attack my PSD's. If I'm designing a site which has 14px font size, should I be creating it at 28px in Photoshop to see what it ...
3
votes
2answers
1k views

How to do a perfect circle with the bezier tool in Inkscape?

I need to create a perfect circle with the bezier tool and not with the circle tool. The purpose of this is to later animate my svg with css.
1
vote
2answers
80 views

Can't figure out why my opacity overlay isn't showing 100%

TL:DR Just look at the image attached (very bottom). :) More details: Read it all, because I probably need more help than I realize. :) I created this and everything is nice and simple the way I ...
-1
votes
1answer
110 views

How can I style this following form to Inline form? [closed]

SEE the link: http://samuelgeorgeo.com/cc/NEWDESIGN/ I have a site based on Twitter Bootstrap. I have two main elements on the page, the bottom one is a horizontal form. I would like the bottom div ...
0
votes
2answers
90 views

In an HTML element, is margin-bottom measured from the baseline?

I'm doing an internal style guide for a big company and want to make sure I get the spacing perfect. If I add margin-bottom to a text element, does it measure from the baseline of the text or the ...
0
votes
1answer
52 views

What are the best tools/processes for web design refinements / adding polish? [closed]

I'm working on a particular part of a web page right now and have a mocked-up design to work from. I've always been able to get everything blocked out in HTML and roughly looking how I like in CSS no ...
2
votes
0answers
45 views

InDesign Faux Italic Font for EPUB

I'm producing an EPUB with Adobe InDesign. Most of the fonts I'm using have Italic and Bold versions. I simply select the correct font in InDesign, and it is set up as a @font-face in the CSS when I ...
-1
votes
2answers
114 views

Critique: Can anyone tell me how I can improve my website? [closed]

I am a bit rubbish at CSS and have mainly based my website off another website, in hope it would look different, although it didn't. I just want comments and tips how to change things but still keep ...
1
vote
1answer
185 views

How do I hyperlink .oam-Animations Muse? [closed]

I have an .oam Animation made in Adobe Edge embedded in Adobe Muse. It animates on mouseenter and mouseleave using JavaScript. How can I hyperlink it using Adobe Muse. I want to use HTML so the link ...
0
votes
2answers
51 views

Improving webpage appearance

I have built out a donate page for our website. The buttons are somewhat similar to the LiveStrong donate buttons. Something about the page looks cheap and unappealing. I have some ideas, but I am ...
2
votes
2answers
194 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. ...
8
votes
2answers
6k views

Specify CSS class names on SVG paths using Illustrator

Is there a way to edit SVG files in Illustrator where you can specify a CSS class for each path? I already know in Illustrator that if you give the layer name an actual name, Illustrator will use ...
3
votes
2answers
766 views

Long Shadow Effect in SVG for Web

Basically I'm wondering if anyone has any ideas on how to efficiently get a long shadow effect with an SVG: Example Image My three ideas on how this might be possible: Hella detailed gradient map, ...
-3
votes
3answers
115 views

How to use photoshop or illustrator or CSS to draw this? [closed]

In Powerpoint, it's easy to create this effect. [Gradient fill] -> [Rectangular] If it is possible, can CSS do this? If not, I was wondering how I can do this in photoshop or illustrator with only ...
0
votes
2answers
302 views

Using Opacity of a Div without affecting The color of the Paragraph inside the Div

I have created a div with background color black, and written a p inside it with white. When I am using opacity in the div, the color of the p is also getting changed into gray. Is there any way to ...
2
votes
2answers
60 views

Considerations for styling of overlay message topbar?

I've created an overlay top bar that slides over the top of the page for confirmation messages. I did a fiddle with it. Now I wonder if the light yellow background is appropriate thinking of the rest ...
2
votes
3answers
126 views

How to properly set the css leading

I have a situation trying to figured it out how o properly use and set the css leading when we have something like this: Even if the line-height is the same, the first 2 lines look pretty far away ...
0
votes
1answer
52 views

Is this possible with html & css [closed]

can this be done? If so what way would you take to accomplish it.
0
votes
0answers
112 views

Extract from Photoshop (psd) to Dreamweaver: Positions of Elements

Let's say I want to import the document created with Adobe Photoshop CS6 (.psd file) to Adobe Dreamweaver CS6. In Dreamweaver, there is a tool which let's to copy CSS styles. However, it copies just ...
7
votes
3answers
28k views

Email signature hell--How to include a logo image and have it stay sharp?

I found a couple useful threads on this forum with respect to the issues posed by (displaying) images in email signatures-- here, for example-- and I've searched all over the web, but still have not ...
3
votes
5answers
10k 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 ...
5
votes
2answers
13k 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 ...
0
votes
2answers
184 views

PSD to HTML&CSS - my margins are wrong

I am having trouble with replicating exact margins from the PSD in CSS. Whenever I measure a margin with a select tool I get, for example, 32px. Then I put this in my CSS code: div { margin-top:32px; ...
6
votes
4answers
15k views

How to convert between Android DP and CSS px?

I see this is probably a noob question, but it truly confuses me. I'm reading documents from the Google Material Design, along with some of its implementations in css. The specification is written in ...
0
votes
0answers
30 views

add large dimension sprite sheet in css using step

I have the flash animation and i want to add those animation in website.i have sprite sheet of those animation as png but it have very large dimension width:52000px.How i can make it better.
0
votes
1answer
504 views

How to crop a round image with transparent background?

I am currently working on a site. I want to create custom radio buttons. The background of the website is an image. So I want the radio button to seamlessly integrate with this background image. I ...