Cheers, I'll double check this tonight and update you with what I have. It will probably be easier if I upload my HTML/CSS.
On Sep 22, 1:07 pm, Michael Kolaski <[email protected]> wrote: > Hi Dave > > Check to ensure your total percentage of DIV widths and margins do not > exceed 100% > > Cheers, > Mick > > On 21 September 2010 22:30, Ryan Randles <[email protected]> wrote: > > > > > 960grid.com > > > Sent from my iPhone > > > On Sep 21, 2010, at 3:46 PM, Dave <[email protected]> wrote: > > > Hi Brandtley, > > >> That helps a bit. I now have four div's one below the other. I > >> can't seem to force them to go into a 2x2 layout. > > >> On Sep 21, 4:44 pm, Brandtley McMinn <[email protected]> wrote: > > >>> Hey Dave, > > >>> You were on the right track using <div>'s, but you just need to style > >>> them accordingly. > > >>> XHTML > >>> <div class="videoContainer"> > >>> <div class="videoPlayerContainer"> > >>> ... video code here ... > >>> </div> > > >>> <div class="videoPlayerContainer"> > >>> ... video code here ... > >>> </div> > > >>> ... more videos ... > >>> </div> > > >>> CSS > >>> .videoContainer { > >>> width: 100%; /* full browser width */} > > >>> .videoPlayerContainer { > >>> position: relative; > >>> float: left; > >>> width: 20%; margin: 10%; /* for a 4 column layout */ > >>> width: 30%; margin: 5%; /* for a 3 column layout */ > >>> } > > >>> Using the % signs when defining width and margin creates a "fluid" > >>> layout. Meaning each <div class="videoPlayerContainer"> will be % width > >>> of the parent object <div class="videoContainer">; which is set to the > >>> full browser width. > > >>> Hope this helps, > >>> Brandtley > > >>> -- > >>> Brandtley McMinn - Creative Director > >>> Gigglebox Studios > >>> [email protected] > > >>> On 9/21/2010 8:49 AM, Dave wrote: > > >>> Hi, > > >>> I want to create a grid layout that will contain a number of quicktime > >>>> plugin windows. Effectively this page would create a sort of video > >>>> wall. > > >>> I would like to be able to create a grid of 2x2 and 3x3, but in each > >>>> case make the grid use the entire browser window, so that if a user > >>>> has a larger monitor the full space will be used. > > >>> I've tried a creating a HTML page with 4 divs and then using a style > >>>> sheet to arrange them, but can't seem to get it right. > >>>> It seems like something that should be quite easy, so perhaps I'm > >>>> missing something obvious, could anyone give me an example of how to > >>>> do this? > > >>> Thanks > > >> -- > >> -- > >> You received this because you are subscribed to the "Design the Web with > >> CSS" at Google groups. > >> To post: [email protected] > >> To unsubscribe: [email protected] > > > -- > > -- > > You received this because you are subscribed to the "Design the Web with > > CSS" at Google groups. > > To post: [email protected] > > To unsubscribe: [email protected] -- -- You received this because you are subscribed to the "Design the Web with CSS" at Google groups. To post: [email protected] To unsubscribe: [email protected]
