Sign in to follow this  
Followers 0
Tjcrazy

Responsive Grid Ideas

2 posts in this topic

Hey Guys

I'm currently producing a website, and I've got an interesting predicament.

I've got a wall, with many thumbnails on it. As you can see in the attached picture.

Basically, I want to somehow make it responsive, so it still looks good for every screen size.

I'm using HTML5Boilerplate, and was wondering how I could make it responsive.

If you look at the attached image, its what I've got at the moment.

Any suggestions, that would be great.

This is the code i've got:


<div id="wall">
<div id="innerwall">
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>

<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>
<div class="face"><img src="images/noface.png" /></div>

</div>
</div>
[/CODE]

CSS:

[CODE]
/*WALL*/
#wall {
background-image: url(../images/bg.jpg);
background-repeat: repeat;
width: 100%;
height: 100%;
min-height: 400px;
overflow: auto;
text-align: center;
}
#innerwall {
margin-left: auto;
margin-right: auto;
width: 90%;
}
.face {
margin: 25px;
float: left;
}
[/CODE]

Tim

post-291040-0-27646300-1352224195.png

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.