Help - Search - Members - Calendar
Full Version: continuation of layout on long pages
Forums > Resource Center > Webmasters' Corner > Resolved Topics
x__rilind
Apr 19 2006, 10:59 PM
I created a photo-blog a few months ago, ran into problems, and stopped a bit. Then a friend showed me this site, and I've come to beg answers of you all.

On the picture pages on my site, the colours of the background stop at a certain point. I have a line in the code for a continuation of the background, but it seems to not be working.

I recieved the basis of the site code from my friend, who apparently got it from here. This is the code for the first picture page, and as you can see (i think) the lighter brown colour stops, but the darker brown continues.

CODE
<HTML><HEAD><TITLE>___PEOPLE _&&_ PORTRAITS___</TITLE>
<STYLE type=text/css>
body{
margin: 0px;
background-color: #653010;
scrollbar-face-color: #653010;
scrollbar-arrow-color: #d8c29b;
scrollbar-track-color: #653010;
scrollbar-shadow-color: #653010;
scrollbar-darkshadow-color: #653010;
scrollbar-3dlight-color: #653010;
scrollbar-highlight-color: #653010;


}

div#wrap {
    margin: -1px;
    background-image: url("http://img.photobucket.com/albums/v488/battousaifire/
website/photoblog/darkmiddle.jpg");
    background-repeat: repeat-y;
    width: 1002px;
}
#container {
    width: 350px;
    position: absolute;
    top: 750px;
    left: 580px;
    font-family: verdana;
    font-weight: normal;
    color:#653010;
    font-size: 9px;
    text-align: center;
}

#sidebar {
    width: 125px;
    position: absolute;
    top: 750px;
    left: 380px;
    font-family:verdana;
    font-size: 9px;
    text-align:center;
    font-weight:normal;
    color:#653010;
}
.sidebar-header {
    font-weight: normal;
    font-family: script;
    font-size: 25px;
    text-align: center;
    border-bottom: 1px solid #653010;
    letter-spacing: 0px;
    text-transform:;
    color:#653010;
}
.contain-header {
    font-weight: normal;
    font-family: script;
    font-size: 25px;
    text-align: center;
    border-bottom: 1px solid #653010;
    letter-spacing: 0px;
    text-transform:;
    color:#653010;
    border-bottom: 1px solid #653010;
}
a:link, a:visited, a:active {
    color: #653010;
    text-decoration: none;
}
a:hover {
    color: #653010;
    text-decoration: none;
    text-transform:uppercase;
}    
</STYLE>

<META content="MSHTML 6.00.2900.2802" name=GENERATOR></HEAD>
<BODY>

<DIV id=wrap><IMG height=1495 src="http://img.photobucket.com/albums/v488/battousaifire/
website/photoblog/people.jpg" width=1002>
<DIV id=container>
<DIV class=contain-header>[ People && Portraits ]</DIV>
<center>
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/6f5d8bdb.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_6f5d8bdb.jpg"></a>  
<br><Br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/69ac0f7d.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_69ac0f7d.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/aj4.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_aj4.jpg"></a>  
<br><Br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/aj2.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_aj2.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/nolan.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_nolan.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/gavin.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_gavin.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/josh2.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_josh2.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/josh1.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_josh1.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/sarah.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_sarah.jpg"></a>  
<br><br><a href="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/helen.jpg" target="_blank">
<img src="http://img.photobucket.com/albums/v488/battousaifire/
portfolio/th_helen.jpg"></a>  
<br><br>
</center>
</DIV>
<DIV id=sidebar>
<DIV class=sidebar-header>Intrasite.</DIV><BR><A href="http://www.freewebs.com/rids_score/people%5F%5Fportraits.htm">
[ people &amp&amp portraits ]</A><BR><A href="http://www.freewebs.com/rids_score/nature%5F%5Foutdoors.htm">
[ nature &amp&amp outdoors ]</A><BR><A href="http://www.freewebs.com/rids_score/inanimate%5Fobjects.htm">
[ inanimate objects ]</A><BR><A href="http://www.freewebs.com/rids_score/other%5Fpictures.htm">
[ other pictures ]</A> <BR><A href="http://www.freewebs.com/rids_score/other%5Fart.htm">
[ other art ]</A><BR><A href="http://www.freewebs.com/rids_score/about%5Fri.htm">
[ rilind in full painful detail ]</A>



</DIV></DIV><!-- end code provided by createblog.com --></BODY></HTML>


I would adore some help in getting this all straightened out. I'm quite a newbie at trying to do website code, but i wanted a site for my graphics and pictures, and I'd love it to at least seem nice!

>rilind
GREASEbaby
Apr 20 2006, 05:14 PM
Hm, it seems perfect in my browser (firefox)..

Do you mean for it to be justified or center aligned?
x__rilind
Apr 20 2006, 10:47 PM
it's center-aligned.

and i'm running it on internet explorer... but it works on firefox? on the pages with all the pictures, where it runs out of background space?

>rilind
Libertie
Apr 20 2006, 11:04 PM
I see what you're talking about on the image pages.. I'm assuming you've got the background image listed in the wrong place. Try putting it in the container div instead? Hmm.

It looks the same in Firefox as in Internet Explorer, only the script font doesn't work in Firefox. Instead I think it shows the default font.

Actually, I would probably put the background image in the body tags.. There's no reason not to..

CODE
body{
margin: 0px;
background-color: #653010;
background-image: url("http://img.photobucket.com/albums/v488/battousaifire/website/
photoblog/darkmiddle.jpg");
background-repeat: repeat-y;
scrollbar-face-color: #653010;
scrollbar-arrow-color: #d8c29b;
scrollbar-track-color: #653010;
scrollbar-shadow-color: #653010;
scrollbar-darkshadow-color: #653010;
scrollbar-3dlight-color: #653010;
scrollbar-highlight-color: #653010;
}
x__rilind
Apr 21 2006, 09:33 PM
ah! that totally worked!

thank you so much. it actually looks correct now!

>rilind
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.