Content Boxes

[lolimaru]

I don't know how to make the content box automatically adjust bigger to fit all the text as it's added. For example, take a look at the layout I made in photoshop:

http://i202.photobucket.com/albums/a...6bd4902e34.jpg

If I wrote a ton of text in the content box, it would eventually flow off the layout. Every other site I see, the content box gets bigger vertically to hold all the content.

I don't have dreamweaver so what I do for a website is make the whole layout in photoshop, then use "auto slice" to grid out the layout into separate .jpg images and provide me with an html file that puts all the pieces together. That's what I did for JeffDeRose.co.cc but I don't ever see anyone else doing that method. I'm thinking it's not the proper way to make a website. My site hasn't even been indexed by Google yet. T^T

[ichwar]

Lol, no. That's not the proper way to make a website, but the graphics look nice. What you need is to create a div for the whole site, and and then a div for each box. Add the header and footer and the beginning and end of each div and then repeat an image vertically (y) for the two sides of the div. The div will be how ever long the contents of the div require it to be.

Does that make sense? If not, I can give you an actual example of what I mean.

[lolimaru]

Lol, no. That's not the proper way to make a website, but the graphics look nice. What you need is to create a div for the whole site, and and then a div for each box. Add the header and footer and the beginning and end of each div and then repeat an image vertically (y) for the two sides of the div. The div will be how ever long the contents of the div require it to be.

Does that make sense? If not, I can give you an actual example of what I mean.

An example and maybe even a link to some tutorials would be great.

I knew I was doing it all wrong. I couldn't even figure out how to make the buttons work. I'm depressed now x.x

Thank you for helping me, I appreciate it

[sourfacedcyclop]

I'll see if I can explain this decently.

You header, nav boxes, footer, top etcetera are each sliced.

Now they are place by using divs and CSS, if you need to learn those, I would recommend.

http://www.w3schools.com/

Or, if you don't want to learn, you could see if someone here would be willing to do it for you.

One way to get the content to expand is this.

Have the top, middle, and bottom section images sliced and declared as something like this

<div class="content">
 <div class="contenttop">
 </div>
 <div class="contentmiddle">
  Content Here
 </div>
 <div class="contentbottom">
 </div>
</div>

Now, the <div class="content"> tag is the content "container" which keeps everything nice and organized, The top and bottom tags would include the image of the top and bottom of the content image.

The main thing is the content middle, which should have the middle section of the content image along with the ability to repeat-y in the css.

So an example of the css could look like this

div.content {
width:600px;
min-height:300px;
margin-left:auto;
margin-right:auto;
}
div.contenttop {
background: url(contenttop.png) no-repeat;
height:20px;
width:600px;
}
div.contentmiddle {
background: url(contentmiddle.png) repeat-y;
width:600px;
min-height:130px;
}
div.contentbottom {
background: url(contentbottom.png) no-repeat;
width:600px;
height:20px;
}

This is a way it COULD work, it could be different for you, buts a very reasonable way to expand the content area.

[jules7]

hi,
Have a look at these standard CSS layouts to get an idea of how it's done. I'm on the same learning curve as you (maybe a bit further along it!).

http://layouts.ironmyers.com/

and the layouts here have been very helpful, also just try googling "simple CSS layouts" .

best of luck

jules

[lolimaru]

Thanks both of you. And sourfacedcyclop, sorry I haven't replied yet, I've been rereading what you wrote and trying to learn CSS. I'm finding it a lot more confusing than HTML.

I'm going to try out Jules7 idea and hopefully it wont be too long before I understand how to make a website correctly.

Good news to me is that Google finally indexed my site. :D I was worried they wouldn't because of my messy HTML.