CODEWITHSUNDEEP
javascriptcsshtml960.gs
Samantha J T Star
Samantha J T Star

Reputation: 32758

Confused about how to add a left margin using the 960 grid

I have the following HTML:

<ul class="container_12">
  <li class="Home current" title="">
  <a title="">Home</a>
  <ul>
     ...

What I would like to do is to have the li elements in the top ul not start directly on the left. I would like to shift them over by maybe one or two grid positions.

Using the 960 grid what would be the best way to do this? I am pretty confused as to if I should change the class of the top ul or if I should enclose the top ul in another container_12 and then have a different class for that ul.

Upvotes: 0

Views: 155

Answers (1)

Neil
Neil

Reputation: 8111

You need to use push_1 or push_2 to move something by one or two of your defined grid positions. Obviously if the both ul's are in the same grid block then they will both move. You will need to separate anything that needs pushing in to another container.

The grid system is really useful when you have a proper understanding of how it works, I think you should get a good foundation about what goes on under the hood, one of the best tutorials for this is - Mastering the 960 grid system

As an aside I can also highly recommend this online tool to help you when creating custom grids - online grid generator

Upvotes: 1

Related Questions