Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3

Thread: Grids and CSS

  1. #1
    Senior Member
    Join Date
    Dec 2013
    Posts
    120
    Member #
    37915
    Liked
    2 times

    Grids and CSS

    I am working on a site, where I am copying a look of another site.

    It's Modern Photography & Cinematography | Radiance Photography Studio, copying the 9 squares from Orange County Wedding Photographer Los Angeles - Lin and Jirsa Photography.


    I copied the CSS. It's very long, around 700+ lines. It seems excessive.

    I see Don't Overthink It Grids | CSS-Tricks, which seems much easier.

    I'm new to CSS, what is the best way to accomplish the 9 square look?

  2.  

  3. #2
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    The CSS for that site's boxes isn't really all that complex. It is a bit more complex than they need to be, since they've basically created a table using divs.

    The "Don't Overthink It Grids" is more for building a reusable whole site grid than something like this, but you could easily adapt it. Honestly, you could just use a <div>, give it the size and height you want for the whole thing, put 9 divs inside, floated left, set to 33.3% width and height. Done. Add content and go.

    Even easier, if the content is images like they have, just float the images left and you won't need to set the width/height as long as the images are the right size.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  4. #3
    Senior Member
    Join Date
    Dec 2013
    Posts
    120
    Member #
    37915
    Liked
    2 times
    I changed the image sizes, floated them all left. Worked great! Thank you!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:21 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com