Solved

Css to add margin to column

Posted on 2013-06-26
3
388 Views
Last Modified: 2013-06-26
I have this newspaper style column in css but I would like to add equal margin in left and right so it would center the 3 columns. right now it looks wide.
I applied it in a DIV in HTML. Should I need another DIV on top of this DIV to add the margin.
Please add the code necessary. thanks

.newspaper3
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
column-count:3;
0
Comment
Question by:zachvaldez
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 6

Accepted Solution

by:
lightspeedvt earned 225 total points
ID: 39279538
No need to add more DIVs on top. Just assign some margins (for example 120px):
    margin-left:120px;
    margin-right:120px;

Open in new window


So, final CSS will be:
.newspaper3{
    -moz-column-count:3; /* Firefox */
    -webkit-column-count:3; /* Safari and Chrome */
    column-count:3;
    margin-left:120px;
    margin-right:120px;
}

Open in new window


Here is demo:
http://jsfiddle.net/2E3fp/
0
 

Author Comment

by:zachvaldez
ID: 39279559
That works perfect! What Id like to shift into is getting away from table structures-the td,tr,etc..
which I've previously use and instead use CSS with rows and cols that is controlled by DVs.
I'll be  creating a page with many labels and textboxes in rows and cols using css.
Im looking for examples to start to buld it.It is a registration page kinda , therefe=ore a a lot of info required with several kinds of controls in it.
Can yo provide an excellent layout to to start with?  Perhaps a few lines for rows and cols. thanks
0
 
LVL 6

Expert Comment

by:lightspeedvt
ID: 39279644
Seems that should be posted as another question, as I haven't excellent layout that will help you to start with.
0

Featured Post

WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

623 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question