i'm working on image heavy single page site , i'm trying figure out safe height/width ratio rough idea of how tall slideshow images if width set 100% while accomodating page elements without pushing "next" button below fold. takes consideration browser interface, taskbar , whatnot.
here's mean: image link
i wondering whether there proposed/researched/applied semi standards 960 grid dealing these layouts?
to clarify: example single page site
for browser/screen (ff19 menu , address bar on 1920x1080 resolution screen) "more" button pushed below fold, have scroll down in order see it. i'm trying avoid. make slideshow image thin leave lot of blank space underneath in cases, i'm trying find useful balance, if exists.
cheers!
your page shouldn't bigger 1024 pixels in width. take @ site , see don't make page bigger 1024*height. if don't want website scroll-able downwards stick less 1024*768. have try out yourself. infact prefer using between 900 1000 pixels width.
sample css code:
*{ margin:0; padding:0; backgroound:#fff; } body { font: .8em arial, tahoma, verdana; background: #fff url(../images/img.gif) repeat-x; color: #777; width: 970px; margin: 0 auto; } edit: answering question if set width 100%, image width inherited container div , height depend on actual height of image. image of height less width of container div, height less image width while image height more container div's width image height more image width.the aspect ratio conserved though. suppose want conserve aspect ratio of images after re-sizing images. should provide max-width , max-height css property images make sure don't go out of container divs , push down more button.
if don't want conserve aspect ratio set width , height of image.
or why don't make 'more' button float-able facebook, google , other links on left hand side of page?
Comments
Post a Comment