Jump to content

Can't get 3rd column content to work


SmokingMan
 Share

Recommended Posts

I have tried and tried to get the content for the far right column to go where it's supposed to go, but it ends up underneath the 1st column. I have looked and fought with this for a long time and I just can't seem to find the problem. This is the link for the page, and here's the link to the stylesheet. I need a new set of eyes for this. What do I need to do to get the content (at this point the candle graphic), to go into a 3rd column where it's supposed to go? :)

Link to comment
Share on other sites

I think this is what you want....

<!-- Begin left column links --><img alt="My Other Links" src="images/MyOtherLinks.png" height="50" width="200" 		title="My Other Links"/><br /><div class="links"><a href="http://www.ftwin.com" title="Ftwin.com Home">Home</a><br /><a href="http://meadowmuffins.ftwin.com" title="MeadowMuffins">MeadowMuffins</a><br /><a href="inspirations.php" title="Inspirations">Inspirations</a><br /><!-- <a href="founding-documents" title="Founding Documents">Founding Documents</a><br /> --><!-- <a href="fun-stuff" title="Fun Stuff">Fun Stuff</a><br /> --><!-- <a href="september11" title"September 11, 2001">September 11, 2001</a> --><a href="mailto:ftwin.com@gmail.com" title="Email">Contact Me</a><br /></div><!-- End left column content --></div></div><div class="rsection">[color="#FF0000"]<div class="rcolumn"><!-- Begin right column content last modified Feb-02-2011 --><!--	<a href="http://www.icdsoft.com" title="Web Hosting By ICDSoft.com" 		onclick="java script:document.location='http://www.icdsoft.com?aff=mgsaylor.ftwin';return false;">		<img width="125" height="125" src="http://reseller.icdsoft.com/b/mgsaylor.ftwin/125x125-2.gif" 			alt="Web Hosting By ICDSoft.com"/></a>--><img alt="Until They Come Home" src="images/UntilTheyComeHome.gif" height="200" title="Until They Come Home" width="143" /><!-- End right column content --></div>[/color]<div class="center-column"><!-- Begin center column content last modified Jan-24-2011 --><div class="center-content">

Link to comment
Share on other sites

the right section '<div class="rsection">' occupies to total remaining area of the page, so there is NO space for the right column to occupy. To get this to work and presuming the right column width should be width: 20% and not 79%?rsectionleft width = 100% -(left column + right column = 40%) = 60so

.rsection {float:right;width:60%;/*amended by dsonesuk*/}

the center column width? is not required.

center-column {float:left;/*width:74%; removed by dsonesuk*/}

Now you have another problem, in that the the right column fits, But! is beside the left column. You have two optionsoption1: (easy option)

.rsection {float:left;/*amended by dsonesuk*/width:60%;/*amended by dsonesuk*/ }

option 2keep using

.rsection {float:right;width:60%;/*amended by dsonesuk*/ }

BUT! move right column div container, UNDERNEATH left column container instead.

Edited by dsonesuk
Link to comment
Share on other sites

  • 4 weeks later...
the right section '<div class="rsection">' occupies to total remaining area of the page, so there is NO space for the right column to occupy. To get this to work and presuming the right column width should be width: 20% and not 79%?rsectionleft width = 100% -(left column + right column = 40%) = 60so
.rsection {float:right;width:60%;/*amended by dsonesuk*/}

the center column width? is not required.

center-column {float:left;/*width:74%; removed by dsonesuk*/}

Now you have another problem, in that the the right column fits, But! is beside the left column. You have two optionsoption1: (easy option)

.rsection {float:left;/*amended by dsonesuk*/width:60%;/*amended by dsonesuk*/ }

option 2keep using

.rsection {float:right;width:60%;/*amended by dsonesuk*/ }

BUT! move right column div container, UNDERNEATH left column container instead.

I know this took an inordinate amount of time to try and then reply, but thanks, this worked (I took the easy option). I don't know why my original code didn't work simply because I used the same exact code (just different class names) on another site and it worked fine. But whatever the reason it's working now and I thank you. :)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...