Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
dont want to use css frameworks like 960 cause that will lock the width.
and using dreamweaver will just add a lot of noise css.
would be good if there was a good css layout reference website with the common layouts and describing how to code that with css manipulating divs, so you dont have to figure it out yourself by experiments.
eg.
header, content, right sidebar, footer
header, left sidebar, content, right sidebar, footer
header, content, rightsidebar, another rightsidebar, footer
and so on.
havent been able to find such a resource, would be great if someone could recommend such pages. thanks.
A List Apart has several good articles about creating liquid multi-column layouts with CSS:
Multi-Column Layouts Climb Out of the Box
In Search of the Holy Grail
They have a bunch more. This is just what I found after a quick search.
The moment you decide not to use a time-tested framework, you potentially create more problems than you solve. That being said, I would encourage one of the two 960 derivatives:
fluid
elastic
Something like Matthew James Taylor's Ultimate 3 column holy grail template? It should have everything you need.
My favorite is Glish.
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 8 years ago.
Improve this question
Currently I am developing website themes with fixed width so please give me a suggestion which framework I should adopt is there any other way to do thing this way.
Thanks in advance.
I suggest you to use Bootstrap 3, it's used by a lot of developers and it's documentation is really helpful.
To learn responsive design better and fast you should:
Understand the use of media queries, this article will let you
know about the standards breakpoints for them.
You can use LESS or SASS for creating a custom Bootstrap grid
that suits your project.
As suggested above, frameworks such as Bootstrap really speed up the development time of a website and make adding responsive layouts easier due to the grid system they use. For extra information using bootstrap go to http://www.sitepoint.com/responsive-web-design-tips-bootstrap-css/. They provide some tips on responsive design.
For responsive website designing, you have to understand the css media queries. Though,it will get your job done, but designing through media queries seems like taking lots of efforts, specially when must faster and less time consuming alternatives are available.
I suggest you to go through twiiter bootstrap framework. Responsive website designing is much easier with it. You have to just include a couple of javascript files and apply some predefined classes(as per your need), and you are done.
There are two very good tutorials, i would like to mention. Just go through with them for a clear crisp understanding of bootstrap simplicity in responsive design. They have pretty good examples too. Just try altering your browser width to get a better understanding.
Bootstrap:
Link 1
Link 2
I would agree with using Boostrap 3 from personal experience.
Also instead of setting actual widths setting percentages instead makes it responsive as it goes to the size of whatever screen size you are using, as an example you can use this link.
Also, check out collapsing navbars for a responsive navigation to be collapsed on smaller devices, here is a link that will help you out: NAV.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
On http://www.csszengarden.com/ how can I move classes (which contain headings and paragraphs) around?
The current order is:
explanation
participation
benefits
requirements
I want:
participation
benefits
explanation
requirements
It should keep the structure with any screen resolution, as it does now.
I don't think there's any way to do it other than using position: absolute and manually placing it on the page.
That may be pretty impractical, depending on what you're trying to do.
It's totally doable with Javascript but that's not what you're asking.
I think that flexbox has an order property, which lets you order your flex items.
For more information, see the specification at http://dev.w3.org/csswg/css-flexbox/#order-property
Note, the flexbox layout module is an Editor's Draft. It might not work as intended in all available browsers, especially in older browsers.
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I want to create some kind of different vertical dividers than usual ones. Instead of using the classic css border properties, how may I implement something like the dividers at the bottom(blue footer) in the following page: https://www.ote.gr/en/web/guest/consumer. I think this must be a picture. If so,any idea where to find some similar pictures?
Thank you very much
The website you gave does indeed use a picture, which is probably the easiest way for this effect.
I would strongly advise you to learn to work with Chrome Inspector or Firebug. This would show you the following:
And this would even learn you the image can be found at https://www.ote.gr/ote-corporate-theme/images/divider.png
I would advise you to create your own image though. Shouldn't be that hard...
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I'm creating a web app and I want people to be able to use it from their phones
this website seems to be using a great responsive css framework:
http://seenive.com/
when you zoom in a lot the top menu collapses very nicely.
any one knows what framework they are using?
The menu collapses not because of zoom but window.innerWidth. When it decreases below a certain width, the menu collapses into drop-down menu.
You can find an example here | JSFiddle demo
Edit: Many frameworks provide this effect but you really don't need one if you only want this effect
Gumby Framework
I never use this framework but they are used that
Github: https://github.com/GumbyFramework/Gumby
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 8 years ago.
Improve this question
I am looking for CSS template that has the following properties:
Website title, menu bar and search box at the top of the page
Tree-based view for the the folders or sub pages on the left
body and the main content on the right
I googled about it but I did not get the exact properties. Please help me
Sounds like you want a CSS layout generator. There are lots of different ones available, but I only linked the first one I found. I suggest that you try them and see what fits your requirements best, since you have not specified if you want a fixed or liquid layout or if any of the sections have a fixed width or height.
For the tree view, if you can use jQuery, I highly recommend the excellent Dynatree plugin which is one of the better tree plugins. I like it purely because it's so customizable.