Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 12 years ago.
Improve this question
First of all I want make clear that though I'm still learning CSS, I think I have fair understanding of it and especially liquid aspect of it and I also think that this is the way to go, however my question is about the graphic stage of web designing, so if I want to start a new project in Photoshop; what are the best page dimension should I use, keep in mind that I intend to use relative values when coding in CSS? and thanks in advance.
I usually use 1300px x 2000px for the photoshop document.
Then I "sketch" up the 960px width wrapper.
From there I start the creative process.
Take a look at http://photoshopetiquette.com/ for some more tips on web design in photoshop.
Cheers!
Most of the pages are being made to fit in 1024x768 (without a horizontal scroll) and the width of the page is about 950-980px. I can suggest you to start with 1200x1400 canvas in Photoshop and you can always resize it just go to Image -> Canvas Size
Related
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 7 years ago.
Improve this question
Say I want to make a website, and I want the page to have some sort of a main-area, and it's supposed to be something like an open book,
sort of something like that if I want to make my point, I want the left border to be 100% of the height of whatever the page is going to show, and the right border(the one that's intersecting with the left border of the right page) to be say 90% of the height of it... that's sort of the idea of the design.
I was sure there would be some HTML5 features that would support this since I've seen stuff like this around the internet but I realized it wouldn't be that easy.
I hoped that there would be people with proper knowledge of web design that could help me with this thing
This is very good article for page flip functionality with html5 :
http://www.creativebloq.com/html5/create-page-flip-effect-html5-canvas-8112798
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I am working on a web site which is supposed to have a fluid layout. I am currently presented with a dilemma: shall I use css sprite or opt for inline images?
All images will need to be fluid and reduce/enlarge their size on each respective screen size. I was thinking to use CSS sprite image but that would mean that I need to identify all major screen widths and then slice all images with those respective widths and add them to my sprite...
My questions is: what is the best approach for rendering images in fluid / responsive designs? Sprites, inline images or combination of both?
Thank you!
Personally I think sprites are a little unnecessary, the internet is fast enough now to just use separate bg images. Displaying the correct image by using media queries and constraining the size in fluid designs by using background-size: cover; or contain.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I´m trying to develop my first website. And I´m a bit confuse about some points.
I´m developping the html & css and then I want to do my website responsive.
First, I did some research to choose the width for my website, and i found information that the 960px is the best width, So I´m developing my content in 960px! But I have a 17 inch laptop and I have too much white space around the content. Its better do with 1024px for example? Or 960px is better?
And if I do with percentage for example, instead 960px use 70% I´ll resolve the white space, right? This is correct to do?
Second, to my site be responsive I was searching information and I was studying about media queries, but if I use percentage, I dont need to use the media queries, because the site is already responsive, right, or not?
Sorry to bother with this question that may seem simple but I am a beginner and I have this doubt, and maybe with your exprience, you can help me understand better.
Using percentage, your site will be fluid. To be responsive, use media queries, so you have a site adapted to the screen size, not forcing the content.
A little about CSS Media Queries: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions concerning problems with code you've written must describe the specific problem — and include valid code to reproduce it — in the question itself. See SSCCE.org for guidance.
Closed 9 years ago.
Improve this question
I'm trying to take a template that was designed to be responsive and make it "unresponsive."
http://myhurlburt.com/NEW/bowling.php
The width of the page is set to 960px. When I view it on an iPad or iPhone, you have to scroll to the side to see the entire page. Do you know what in my CSS is causing that? I would like the entire site to "fit" into a browser so the user does not have to scroll to the side.
It's a big job to change an unresponsive site to a responsive one.
But you could try something like this to get started.. .wraper currently has it's width set to 960px.
.wraper{
width:100%;
max-width:960px;
}
use % for width, height and other margins. Use media queries also. If not, do zoom:1(2,3 or something);
Start by scaling the website with min/max widths and additionally use percentages instead of px.
Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 11 years ago.
Improve this question
Please check out this image:
Look at the part that says 'keyboard'
I want that shape but facing the other way (right) and not curved.
I know this is a pentagon but its not the standard type so its hard to find the name or type of this shape to learn how to make it in css. Any ideas on how to make it!?!?
Thanks guys,
James
It's a rounded rectangle and a triangle (or a rotated square). To make it in "CSS" would require some hacks. I suggest you use a background image.
Mimicking the iPhone design purely in CSS is nearly impossible. However:
I found iWebKit, written by a guy who spent a lot of time on just that task. He did the navigation buttons with border images.
You can take a look at it at http://snippetspace.com/ . It's free to download, I think.
Looking at the demo code, you can easily see how the buttons work.
iWebKit is only for webkit browsers, but it does not take a lot of work to adapt to other browsers (just add -moz or -o lines where it says -webkit in the CSS).