HTML Help

waitwhat · Joined: 17 Nov 2008 Posts: 28

Hi all, my graphic designer put together a mock page that can be viewed here:

http://www.mattboehlerresume.com/backend/NI_HN_Radio_web_page.jpg

And I am focusing on the green box on the left hand side, underneath the nav bars. This is where the body text will go. The top, middle, and bottom outline of the box are here:

http://www.mattboehlerresume.com/backend/buttons/main_box_top.jpg
http://www.mattboehlerresume.com/backend/buttons/main_box_middle.jpg
http://www.mattboehlerresume.com/backend/buttons/main_box_bottom.jpg

My question is, what is a simple way to place this in the background, so that the middle repeats until the text stops. I don't want to go into photoshop and create a box that is big enough to support the text, because then I will be altering the jpg every time the text changes. It seems there has to be an easy way to do this, but I just can't think of it. Any suggestions?

Also, is Images & Grsaphics the best place for a post like this?[/url]

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

Strange I didn't see a green box on the left. :P

Using the image "http://www.mattboehlerresume.com/backend/buttons/main_box_middle.jpg " as a repeatable background image for the text div container might work. It would be set to "repeat-y" for that div.

When you have a link to a test page or actual site you are working on, might check further if that will work. Only guessing when you produce only an image to work from.

waitwhat · Joined: 17 Nov 2008 Posts: 28

hey thanks for the help. I thought it solved my problem, then I went to my page here:

http://www.mattboehlerresume.com/backend/index.php

And it didn't look right. Here is the code from my index.php file:

Quote: <div id="Mainbox">
<img src="main-images/main_box_top.jpg">
<p font-size: 18px; >Text goes here.</p>
<img src="main-images/main_box_bottom.jpg">
</div>

And this is from my css

Quote: #Mainbox
{
width: 669px;
position: absolute;
background-image: url(main-images/main_box_middle.jpg);
background-repeat: repeat-y;
}

Any ideas?

waitwhat · Joined: 17 Nov 2008 Posts: 28

Posted twice.

waitwhat · Joined: 17 Nov 2008 Posts: 28

Ok I got that problem figured out. Now, if you go to the link above, the footer is not aligned properly. Does any one have any idea why?

PayneLess Designs · Joined: 28 Feb 2007 Posts: 3593 Location: Biloxi, MS

You have these HTML Errors to be corrected first.

Also, you are putting browsers into Quirks Mode by not having a proper DocType.