Hi All

 

Ive been left with changing our business website, something that was done by my father, but he has since passed away.

 

I am having troubles with the layout and wondering if anybody could help.

 

I have 2 columns and cannot get them side by side, fustrating!

 

site is here: getahead-direct.com

 

Any ideas?

 

Thank you

I would find the div's id/class and edit the CSS.

 

Just from looking at your website, I think the problem is that the collumns are too wide. They will over run the body width. Try making them a little smaller for instance...:

 

If the body (May also be a div) is like this:

 

body {

width: 800px;

}

And your content inside the boxes when added up is over 800px... Then they will not sit side-by-side. You need to change the width of the content inside the div that houses them to be within the maxiumum limit.

 

After you have done this, it might pay off to just use the following CSS to position the boxes as it seems you plan to put two in each row:

 

float: left;

float: right;

 

If you wish to center something, just use this instead:

 

margin-right: auto;

margin-left: auto;

And if needed:

Display: block;

 

 

I didn't get a chance to look at the code so I don't know how good this advice is, but you can certainly adapt the CSS files for you site to house this method. Just depends on how time consuming that may be.

 

Alex O'Connor

Thanks Alex, still no luck.

 

heres the code I have for it

 

#wrap {display: block; background-color: #FFFFFF; color: #666666; margin-top: 9px; }
* html #wrap {margin-top: -10px;}
#left {display: block; background-color: #FFFFFF; color: #666666; width: 208px; float: left; position: relative; top: 0px;}
#group {display: block; background-color: #FFFFFF; color: #666666; width: 933px; float: right; position: relative; top: 0px;}
#centre {display: block; background-color: #FFFFFF; color: #666666; width: 608px; right:left; top: 0px;}

 

<!-- InstanceEndEditable --></div>
<!--end centre div-->


</div><!--end group div-->
<div id="left">
<?php include("/home/fhlinux146/g/getahead-direct.com/user/htdocs/includes/a_column.php"); ?>
</div>
<!--end left div-->

<div class="fauxclear"></div>
</div><!--end wrap div-->
<div id="tutorials"><a name="freetutorials" id="freetutorials"></a>
<?php include("/home/fhlinux146/g/getahead-direct.com/user/htdocs/includes/freetutorial.php"); ?>
</div>
<div id="freedown"><a name="freedownloads" id="freedownloads"></a>
<?php include("/home/fhlinux146/g/getahead-direct.com/user/htdocs/includes/freedownload.php"); ?>
</div>

<div id="footer">
<?php include("/home/fhlinux146/g/getahead-direct.com/user/htdocs/includes/footer.php"); ?>
</div><!--end footer div-->
</div><!--end page div-->
<?php include("/home/fhlinux146/g/getahead-direct.com/user/htdocs/includes/google.php"); ?>
</body>
<!-- InstanceEnd -->

#left {display: block; background-color: #FFFFFF; color: #666666; width: 208px; float: left; position: relative; top: 0px;}

#group {display: block; background-color: #FFFFFF; color: #666666; width: 933px; float: right; position: relative; top: 0px;

 

This would make the overall lengh of your entire webpage 1141? If your total page lengh is -LESS- than that, that's the reason it won't work. It's hard to see from here why it will not work, but if you could email me all the files 'saiminhru@live.com', I can take a look for you. Or email me a link of where I can download a zipped version of your site.

 

Alex O'Connor -

Hi

 

Silly me, dont know hoe I didnt pick up on that, I have changed that now, now they are both on same area, but overlapping each other...getting there!

Take out position: relative; see what happens. Might not do anything but it's worth a try...