MarksCode
MarksCode

Reputation: 8576

Best way to create grid of divs?

I'm making a friends list script for an online browser game I play. I have 4 divs I need within the wrapper: 1) List of friends, 2) Add Friend, 3) Friend requests, 4) Chat. I figured out how to get the first two, but I need advice adding the rest. Here's what I have so far and what I want to add:

div

What would be the best way to add the two divs on the right? Should I make some sort of table of the 4 divs?

My css for the two divs both look something like this:

  position: relative;
    width: 40%;
    height: 70%;
    top: 5%;
    left: 2%;
    border: 1px solid blue;

If anyone can give me insight on a good way to accomplish this setup I'd greatly appreciate it. Here's a fiddle of the basic outline I have so far: https://jsfiddle.net/kfupd6hb/1/

Upvotes: 1

Views: 60

Answers (2)

ScientiaEtVeritas
ScientiaEtVeritas

Reputation: 5278

I suggest using display:inline-block; to get the <div>'s side by side, you can make a really perfect grid with that property.

Upvotes: 1

Abhishek Panjabi
Abhishek Panjabi

Reputation: 439

You can use float:left; attribute of css. I've updated ur fiddle.. Somehow i'm unable to create a link here that's why providing link in comment.

Upvotes: 1

Related Questions