Jump to content

iPixel

Members
  • Posts

    496
  • Joined

  • Last visited

Profile Information

  • Gender
    Not Telling

iPixel's Achievements

Advanced Member

Advanced Member (4/5)

0

Reputation

  1. I've looked at a few responsive grid frameworks. However, their samples and how they work dont exactly seem to allow me to do what i ideally need. I know they can allow me to do my 3 column layout easily... But will these still work while being nested within other divs. The above example was a very stripped down version.
  2. Ok it helps, but i cant for the life of me get any padding on the left and right side. I need a container thats 1010px wide and the columns should be like so: (including 10px margins). 10px 190px 10px 570px 10px 190px 10px. Any ideas?
  3. Hmm found this... should help. http://www.cutcodedown.com/for_others/enormousRodent/template.html
  4. I'm trying to figure this out... i have a 3 column layout and i need the center column to resize automatically as the browser shrinks. The idea here is to NOT use @media queries and pixel breakpoints. Which is why the #wrapper & #mid divs are set to 100% width. However the issue is that instead of the center column getting thinner, all the columns just pop down. My CSS bl0wz, so any help would be appreciated. Below is what i have so far. <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Some title</title> </head> <style type="text/css"> html, body { padding:0px; margin:0px; } #wrapper { max-width:1024px; width:100%; padding:0px; margin:0 auto; background:#CCC; } #left { float:left; max-width:190px; min-width:190px; width:190px; height:500px; background:#9CF; } #mid { float:left; max-width:644px; min-width:190px; width:100%; height:500px; background:#9C6; } #right { float:left; max-width:190px; min-width:190px; width:190px; height:500px; background:#CC6; } </style> <body> <div id="wrapper"> <div id="contentpad"> <div id="left">Left</div> <div id="mid">Middle</div> <div id="right">Right</div> </div> </div> </body> </html>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.