1 Replies - 1347 Views - Last Post: 17 March 2013 - 06:38 AM

#1 jorgepson  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 3
  • Joined: 04-March 13

How to Develop flexible design

Posted 05 March 2013 - 12:57 AM

I dunno know if this will be a help,

Here's what i found in developing a flexible and responsive web design

@media screen and (max-device-width: 480px) {
.column {
float: none;
}
}

Or as part of an@import directive:
@import url("shetland.css") screen and (max-device-width: 480px);


Adapt, respond, and overcome

Let’s turn our attention to the images at the base of our page. In their default layout, the relevant CSS currently looks like this:

.figure {
float: left;
margin: 0 3.317535545023696682% 1.5em 0; / 21px / 633px /
width: 31.121642969984202211%; / 197px / 633px /
}li#f-mycroft,
li#f-winter {
margin-right: 0;
}
linearize the page let's say 600px
@media screen and (max-width: 600px) {
.mast,
.intro,
.main,
.footer {
float: none;
width: auto;
}
}

source: http://www.gather.co...281474981856250
sample responsive web design

This post has been edited by Dormilich: 05 March 2013 - 02:26 AM
Reason for edit:: please use [code] [/code] tags when posting code


Is This A Good Question/Topic? 0
  • +

Replies To: How to Develop flexible design

#2 CynicalSolution  Icon User is offline

  • New D.I.C Head

Reputation: -3
  • View blog
  • Posts: 15
  • Joined: 17-March 13

Re: How to Develop flexible design

Posted 17 March 2013 - 06:38 AM

Percentages, Media Queries, jQuery and a good layout design
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1