I have a slight problem, I am attempting to align a twitter script and another script on one page, next to eachother, yet no matter how small I make the width of the style div, they remain on two individual alignments, one below the other. I have attempted to close the first DIV after the second but to no avail.

<div> is a block tag, as opposed to <span> which is an inline tag. A block tag fills the width of its container, thereby forcing adjacent code to fall on a new horizontal line. The only way to make two adjacent block tags sit on the same horizontal line is to float one or both of them. To be floated, you must specify an explicit width and a float direction for each floated element in your CSS. So for example,

.debate {

width:200px;

height:1000px;

margin:20px 0 0 8px;

float:right;

}

See if that does what you want.

In addition, though, I also have to say that it's a very poor technique to assign an explicit height to any container that will have text content in it. The usual method is to let the contents determine the height of the container.