Fixing My Style Sheet., Not sure what's wrong.

[k.digennaro]

o cool! i think i figured it out on my own . I now have the background the way i want it. But it doesnt take up the whole page. Why is that? how can i fix it?

CODE

/* Layout Stylesheet */

body{
margin: 0;
padding:0;    
background: url(http://i269.photobucket.com/albums/jj66/ihclub_hockey/background-5.gif) no-repeat;
color: #333333;
}
    
#hdr{
width: 100%;
height: 196px;
margin: 0;
background: url(http://i269.photobucket.com/albums/jj66/ihclub_hockey/Header.gif) no-repeat;
color: #333333;
}
    
#lh-col{
width: 60%;
float: right;
background: url() no-repeat;
color: #333333;
margin: 0;
padding: 40px;
}

#rh-col{
background: url() no-repeat;
color: #333333;
margin: 0;
padding: 0;
border: 0;
}

[Andrew]

The background doesn't take up the whole page because the image isn't the width of the whole page. You can make the image repeat if you want it to fill the whole page.

[MrTouz]

If you want it repeat

CODE

body{
margin: 0;
padding:0;    
background: url(http://i269.photobucket.com/albums/jj66/ihclub_hockey/background-5.gif);
background-repeat: repeat;
color: #333333;
}

It'll repeat in Y and X, if you want it to repeat only Y than repeat-y if you want it X than repeat-x.

[k.digennaro]

The background doesn't take up the whole page because the image isn't the width of the whole page. You can make the image repeat if you want it to fill the whole page.

hmmmm, that makes sense, that's what i thought it was.

Now that brings me to another question that ive asked on many forums. What size should I draw my web designs on? If I want them to take up the whole page. Every time I ask the question they say, well it depends. If that's truely the case, what does it depend on?


Thanks,
Kevin

[Andrew]

Okay to explain it simple it really DOES depend. It depends on how you design the site. If you cut up your design it really won't matter. Like say for your header image, if you make everything transparent except the words or images on it, then you could just have that centered or where ever you want it, then make a seperate background image behind it. And then the rest of your page even with images if you make them correctly you could have your divs for the content to say take up 80% of the page. Meaning there will always be 10% of blank space on each side of the content no matter how big or small the browser window is. Take for example this forum. It's set to 80% of the page. So you can resize this window to however big or small and it will always leave 10% of the window with the blank white color.

Now that I just read that, it really isn't that simple. If you want I could make up a simple example for you. Or if you wanted I could use whatever you have done for your site already and cut up the images and code it so it works like you want.

I normally work with an 800 or 900 wide image because the most commonly used screen resolution is 1024x768 and if you make the page like I just explained then you can make it so even the guys on smaller screens can see it.

[k.digennaro]

Okay to explain it simple it really DOES depend. It depends on how you design the site. If you cut up your design it really won't matter. Like say for your header image, if you make everything transparent except the words or images on it, then you could just have that centered or where ever you want it, then make a seperate background image behind it. And then the rest of your page even with images if you make them correctly you could have your divs for the content to say take up 80% of the page. Meaning there will always be 10% of blank space on each side of the content no matter how big or small the browser window is. Take for example this forum. It's set to 80% of the page. So you can resize this window to however big or small and it will always leave 10% of the window with the blank white color.

Now that I just read that, it really isn't that simple. If you want I could make up a simple example for you. Or if you wanted I could use whatever you have done for your site already and cut up the images and code it so it works like you want.

I normally work with an 800 or 900 wide image because the most commonly used screen resolution is 1024x768 and if you make the page like I just explained then you can make it so even the guys on smaller screens can see it.

if you had time to do that i would really appreciate it. This is the basic idea for the site, there are a couple things im going to mod/change, but for the sake of example this should work.


To the left of the 'A.P Home Repair' I want to put this logo.


Then were it says 'free estimates this would go there.



Thanks for all the help tripin, hopefully after this webpage ill be able to do 90% of it on my own .

Kevin

[k.digennaro]

please let me know if you need anything else, or if you dont have time to help me on this, this way i can figure it out. Im still working on it .


Thanks
Kevin

[Valency]

For the free estimates, I can imagine simple HTML img src could go there, Might work.

[Andrew]

http://trippin.uni.cc/homerepair.zip

Tell me if thats what you wanted.

[k.digennaro]

http://trippin.uni.cc/homerepair.zip

Tell me if thats what you wanted.

wow man that looks great, its exactly what i was going for, only thing is the page might need to be a little longer, and i might addjust the animation speed. There are a couple things i would like to add, but hopefully ill be able to figure them out, if not ill post back here. Im really really thankful for the help youve been giving me trippin, if thers any thing i can do please let me know. Maybe i could put a link to your page or something somewhere on the page. Leme know what i can do for you.

Thanks a bunch,
Kevin

[k.digennaro]

I'm not quite understanding this '<br />' tag theres no begging to it, only an end tag? Any ways, that any if you look down i tried to insert some text. I got the title working with my font style etc, but the body of the text wraps around the title, im not sure why, maybe i need to create some sort of div that im missing or something?

Thanks a bunch,
Kevin

CODE

............
<div id="area">
<div align="center"><a href="#"><img src="images/estimates.gif" width="404" height="66" alt="Free Estimates!" /></a></div>
<br />
Sorry this website is in the hospital. If you would like to send it flowers or a
get well card, please use the contact page. Otherwise, please check back
to see when the website gets out!<br />
Best wishes,<br />
Website Admin.

<br />
<center>
<font style="font-size:28px" color="#000000" face="Arial"><b><u>Our Mission</u></b></font></div>
</center>

<div>
We service, repair, and do all phases of home care! No job too small or big. You service your car on a regular basic to protect your investment.
Why not do the same to your biggest investment?, your home. Free estimates! Call Today! 513-239-1616 Ask for Paul Huffman.
</div>

</div>
<div style="clear: both;">&nbsp;</div>

<div id="footer">
Copyright 2008 K.DiGennaro
</div>
..................

[Andrew]

the <br /> are the same as <br> but it's properly written for xhtml. <br /> is the open AND close tag. Its just a line break.

Also, you've got one serious errors here.

CODE

............
<div id="area">
<div align="center"><a href="#"><img src="images/estimates.gif" width="404" height="66" alt="Free Estimates!" /></a></div>
<br />
Sorry this website is in the hospital. If you would like to send it flowers or a
get well card, please use the contact page. Otherwise, please check back
to see when the website gets out!<br />
Best wishes,<br />
Website Admin.

<br />
<center>
<font style="font-size:28px" color="#000000" face="Arial"><b><u>Our Mission</u></b></font>****moved closing div tag from here to just above footer****</center>



<div>
We service, repair, and do all phases of home care! No job too small or big. You service your car on a regular basic to protect your investment.
Why not do the same to your biggest investment?, your home. Free estimates! Call Today! 513-239-1616 Ask for Paul Huffman.
</div>
</div>
</div>
<div style="clear: both;">&nbsp;</div>

<div id="footer">
Copyright 2008 K.DiGennaro
</div>
..................

See my note wrapped in ****'s
That should fix your problem. if it doesn't i'll have to open it again from the files i have.

[k.digennaro]

thanks trip, thats what it was, i didnt even realize i had a div tag in there, o well.

THanks again,
Kevin

[Andrew]

No problem, if you don't mind, let me know when you have it running live. I'd like to see what changes you do.
Oh and you can link to my site if you'd like, but I definitely won't require it. I was bored, and felt like helping you out.

[k.digennaro]

No problem, if you don't mind, let me know when you have it running live. I'd like to see what changes you do.
Oh and you can link to my site if you'd like, but I definitely won't require it. I was bored, and felt like helping you out.

yeah ill defenitely let you see it when its done, well im all for paying people back so if you have an ad or something you want to put on the site or in the future would like to put on the site, send it to me and ill give it a premium spot .

Thanks for all the help,
Kevin

[k.digennaro]

hmmmm, im having some trouble with the site and im not sure why. Theres nothing wrong with the index.html, but sometimes when i go to the site its all messed up, then i have to click refresh several times and it finally fixes it, it seems like its having trouble locateing my style.css

[Valency]

I have also suffered this, My index.html page went to italics when there was not any <i> codes in it LOL
I just deleted the css and uploaded it again and it fixed it.. Try deleting your css then uploading it again