nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Child Item

Float or Position? 2/3 Columns CSS

Elmo

I am floating most of my columns but just wondering is it easier to use positioning for columns to insure that they are equidistant from each other?

Or how do I keep my columns equidistant using floats?

Find more posts tagged with

Quick Links

Comments

Placebo

float and margins?

Elmo

Placebo wrote: »

float and margins?

I use margins, but find that its always a little off

is there a way of get the column exact?

But avoid positioning for this right?

Placebo

you could always have a wrapping div and then use position absolute/relative.
However i dont see how margins can be a little off? you're in control at a per pixel rate

post up your code/link

Elmo

Placebo wrote: »

you could always have a wrapping div and then use position absolute/relative.
However i dont see how margins can be a little off? you're in control at a per pixel rate

post up your code/link

Yeah worked it out, from your question, I was using % in the CSS file for each div tag and setting them each at 30%, I am now being specific using px and taking into account the padding and margins used, this has worked e.g.

#div1  {
	width: 308px;
	float: right;
	padding: 5px;
	overflow: auto;
	height: 310px;
	background-color: #FFF;
	position: relative;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
}

#div2 {
	width: 308px;
	float: right;
	padding: 5px;
	height: 310px;
	background-color: #FFF;
	position: relative;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 5px;
}


#div3 {
	width: 308px;
	padding: 5px;
	height: 310px;
	float: left;
	background-color: #FFF;
	position: relative;
	margin-top: 5px;
	margin-right: 5px;
	margin-bottom: 5px;
}

Body is set to 980px

Q. Can you use absolute positioning in a class?

.class {	
	position: absolute;
	top: 0px;
	right: 0px;
	width: 100%;
}

Elmo

Seems you can. Thanks again for everyone's help

Sometimes I just need to ask questions to get me thinking.

ivanc

Elmo wrote: »

Body is set to 980px
[/code]

Have you looked at the 960 Grid System? Takes care of a lot of positioning issues with fixed width sites.

http://960.gs/