kingo'mountain — Fri, 13 Oct 2006 20:14:48 +0000

can you check my attachment or download privilages, i'm getting an error saying i've gone to a restricted page while trying to download an attachment, while i'm logged in ofcourse

Megan — Fri, 13 Oct 2006 16:46:46 +0000

This is actually no problem. If you had boxes with text on each side it might be a little trickier. This is easy though.

Yikes! You put font tags in there too! You really need to learn some CSS, asap! That poor template, I feel bad for it being massacred by tables and font tags

I actually started working on this for awhile with your code but lots of things were getting messed up so I'm going to work with what I had before. I'll attach my original HTML and CSS files if you need them. The code you had is very different from what I was working on.

From here, what we need to do is make room for the images on the front page. So we'll make a new class for widecontent and apply it to the two div's:

  <div class="widecontent">
        <h1>Second Header</h1>
        <h2>Welcome</h2>
       (lorem ipsum text was here).      </div>

     <div class="widecontent">
        <h1>More stolen content from lipsum.org</h1>
      (text was here)    </div>

The widecontent class will look similar to the content class, only with a different width:

.widecontent {
	float: none;
	clear: left;
	width: 650px; 
	margin: 0;
	font: normal 11px/18px arial, verdana, helvetica, sans-serif;
	text-align: justify;
	}	

Now the images need to go in and both the text blocks and the images need a class="content":

  <div class="widecontent">

	 	<div class="content"> <img src="images/money.jpg" width="200" height="200" /></div>
		<div class="content">
	    	<h1>Second Header</h1>
        	<h2>Welcome</h2>
			<p>text was here  </p>  
		</div>
	</div>


     <div class="widecontent">
	
		<div class="content">
			<h1>More stolen content from lipsum.org</h1>
			 <p> text was here</p>
	 
	 </div>
	<div class="content"> <img src="images/money2.jpg" width="218" height="218" /></div>
</div>

'I added some paragraph tags in there while I was at it.

The problem we have now is that the images aren't centered. We can just use inline CSS to do that, so add style="text-align: center;" to those div's (not the best method, but easy for right now).

Everything is looking good in Firefox and Opera. IE has a bit of a problem with the margins on the .content class. To fix this I just changed the margin on the .content class. This isn't ideal but it works:

.content {
	float: left;
	width: 290px;
	margin: 20px 10px 0 15px;
	padding: 0;
	font: normal 11px/18px arial, verdana, helvetica, sans-serif;
	text-align: justify;
}

That's all I'm going to do, okay? You really need to learn some proper web design methods! The attached files are what I had after my last post. You can try to implement what I posted today - if you keep having trouble I can post my final code.

kingo'mountain — Fri, 13 Oct 2006 14:29:29 +0000

ok, if you know of a way to get everything nice and dandy without using a single table, i challenge you, only you.... to get everything aligned like it is right now... because i'm hopeless when it comes to CSS.....

i'll have to split the site to the code and the pictures in seperate zips because the filesize limit is not 100k, but only 50k, sorry

Megan — Fri, 13 Oct 2006 13:00:08 +0000

There are ways to get around that. Rather than messing up a perfectly good xHTML strict layout

kingo'mountain — Thu, 12 Oct 2006 21:29:46 +0000

you dont understand, i've replaced the .content div because when i add more lines to one of the text blocks, the alignment gets messy and evasive even, a table keeps everything intact, think of tables as cement to building blocks, it bonds them, so i think the 2 (tables and CSS divs) should forever be together because if used right, the stars are the limit

Megan — Tue, 10 Oct 2006 13:05:38 +0000

kingo'mountain;208253 wrote: i've also replaced the main content (text paragraphs) divs with a table, yes, i know tables suck major butt and W3 are going to put out table use for good, but for me its a lifesaver, without it, i'd leave all the site building alone until i die, hehe

Awwww! That's so disappointing! That template was so well coded :( I foud those boxes to be a bit of a problem anyway - you're going to have trouble if they're not quite the right length. Finding another way to display that would be good. The secret to getting them to line up is to get the width just right. Try playing with the width on the .content class. You could also put a height and overflow: scroll in to get the heights to work right.

I'm glad to hear you've goten things straightened out.

kingo'mountain — Sat, 07 Oct 2006 22:38:45 +0000

i've made major progress since then, just so you wont have to come with a solution to the new members section, i already fixed that, i replaced all the "main" div (the section where the "new members" are") with a simple table, so now its aligned and i finally got what i wanted!...

i've also replaced the main content (text paragraphs) divs with a table, yes, i know tables suck major butt and W3 are going to put out table use for good, but for me its a lifesaver, without it, i'd leave all the site building alone until i die, hehe

now i only need to fill the panes with boxes (not the profile ones) like
making a login form, adding some banners, a few combo boxes and dropdowns (i'll need help with them)

if you want an updated zip with the changes, say so, i'd love to show you how it looks now :jump:

kingo'mountain — Fri, 06 Oct 2006 22:27:12 +0000

well, the panes went well, i've added them without taking the profile boxes off, so that made a gap between the main black bar (with the colored buttons) and the outer border, but once i got rid of the boxes it all aligned like it should, i've also taken the opportunity to get that same black bar i mentioned on top of the inner wrapper because i discovered that once i reduced the width of the wrapper and main, the stats on the bar would overlap with the buttons, so thats fixed too....

about the new members thing ..... i was thinking:

|    new members   |   some other content  |
|                  |   which is just text  |
|    dan           |                       |
|    igor          |                       |
|    michael       |                       |
|                  |                       |

Megan — Fri, 06 Oct 2006 19:21:04 +0000

Alright, now I've got those columns fixed. Unfortunately we have to use a little filter for IE 6. Replace the #wrapper CSS with this:

#wrapper {
width: 650px;
margin: 0;
background-color: #F3F3F3;
border-bottom: none;
height: auto;
float: left;
}

html>body #wrapper {
margin-left: 150px; 
float: none;
}

IE 6 and below will not see the bit in the html>body. So it will be floating that div to the left. The others will keep it in place and apply a left margin.

I'll try to help you again once I'm clear on what you want to do with that members block. I will be away for the weekend though so hopefully someone else can help you before then.

Let me know if you have problems getting this code working and I'll show you what I have here.

Megan — Fri, 06 Oct 2006 18:55:29 +0000

Arrrgggh! This is really annoying, I have the same code working on another site but it's not working here! (for the right column.)