Thu, 2005-10-06 17:19
I need to move this from html to css so my webpage will be xhtml 1.0 strict.
<body background="images/angel.png">
here is my css.
<style type="text/css">{ }
body {
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
color:rgbrgb(0,0,0);
}
h4 {
margin:0px;
}
#container {
background-color:transparent;
border:0px solid;
}
#header {
background-color:transparent;
border-bottom:0px
height: 60px;
text-align:center;
}
#leftcolumn {
float:left;
background-color:transparent;
height:450px;
width: 25%;
text-align:center;
padding-top:2px;
}
#centercolumn {
float:left;
background-color: transparent;
height:450px;
width: 50%;
text-align:center;
padding-top:2px;
overflow:auto;
}
#centercolumn p {
text-align:justify;
margin:20px;
}
#rightcolumn {
float:left;
background-color:transparent;
height:450px;
width: 24.9%;
text-align:center;
padding-top:2px;
}
#footer {
clear:both;
background-color:transparent;
border-top:0px;
height: 60px;
text-align:center;
}
-->
</style>
Here is a link to my website so you can see what I am trying to do.
Thu, 2005-10-06 17:34
#1
body-background in css
Then you need to code this:
body {
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
color:rgbrgb(0,0,0);
background: url(images/angel.png); <<but check your paths
} Anymore than that and you will need to explain a little about your requirements.
Hugo.
Thu, 2005-10-06 17:35
#2
body-background in css
Just add
Background: url(images/angel.png) 0 0;
In the body selector.
Thu, 2005-10-06 17:38
#3
body-background in css
inline styling is okay to use even in xhtml, but the format is like this:
<body style="background: url(images/angel.png)"
or to move it to your stylesheet (remove background from html) add this to your body rule
background: url(images/angel.png);
Now for some other errors:
you're missing the opening <html> tag,
you have two <body> tags,
you have an image tag after the </html> tag - in needs to be inside the body.
Edit: xposted with briski
Thu, 2005-10-06 22:08
#4
Re: body-background in css
dvdljns wrote:
body {
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
color:rgbrgb(0,0,0);
}
Can you use RGB values in your CSS like this? How widely supported is it?
Thu, 2005-10-06 23:22
#5
Re: body-background in css
Tyssen wrote:
No, the syntax is wrong. It should look like this:dvdljns wrote:
body {
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
color:rgbrgb(0,0,0);
}
Can you use RGB values in your CSS like this? How widely supported is it?
color:rgb(255,102,0);
You can also do percents:
color:rgb(100%,40%,0);is the same as color:orange;orcolor:#f60;
Thu, 2005-10-06 23:24
#6
body-background in css
Do all browsers support it? Is there any advantages/disadvantages of using RGB over hex values?
Thu, 2005-10-06 23:37
#7
body-background in css
Tyssen wrote:
As far as I know, yes. (do not quote me on that)
Do all browsers support it? Is there any advantages/disadvantages of using RGB over hex values?
Advantages? I guess it's just another option. Maybe if you are given rgb values instead of hex by a client it would be peachy to use it instead of trying to convert it to hex.
Fri, 2005-10-07 04:30
#8
body-background in css
yep! I got two rgb. worked all last night by the time I did this, it's no surprise.
had no problams using. rgb 0,0,0.
Fri, 2005-10-07 06:19
#9
body-background in css
It did not work. lost the bakground.Take a look.
Fri, 2005-10-07 06:22
#10
body-background in css
wolfcry911 wrote:
Now for some other errors:
you're missing the opening <html> tag,
you have two <body> tags,
you have an image tag after the </html> tag - in needs to be inside the body.
Edit: xposted with briski
Where cannot find them.
Fri, 2005-10-07 07:57
#11
body-background in css
Most of those errors are Geocities errors, don't worry about them.
For some reason, you have this:
< href="http://www.geocities.com/dvdljns/images/" target="angel.png">
in your head section. Why?
Your syntax is wrong. This is right:
background: url(http://www.geocities.com/dvdljns/images/angel.png) 0 0;
Fri, 2005-10-07 08:00
#12
body-background in css
Background: url(<"http://www.geocities.com/dvdljns/images/"angel.png">) 0 0;
should be
Background: url(http://www.geocities.com/dvdljns/images/angel.png) 0 0;
You should not have the < or > and there is no need for the quotes either.
[edit] cross posted with TPH but you could use this more relative path I imagine
Background: url(../images/angel.png) 0 0;
[/edit]
Mon, 2005-10-10 08:18
#13
body-background in css
Ok! heres what I did.
I got this where it will valadate.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="eng">
<head>
<title>3col</title>
<meta name="Description" content="a three column web page" />
<meta name="Author" content="dvdljns" />
<meta http-equiv="Content-type" content='text/html; charset="UTF-8"' />
<style type="text/css">
@import url(style/3col.css);
</style>
</head>
<body>
<div id="container">
<div id="header"><h4>This is my header.</h4></div>
<div id="leftcolumn"><h4>This is my left column</h4></div>
<div id="centercolumn">
<h4>This is the center column.</h4>
<p>
<b>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Praesent blandit venenatis purus.
Integer massa libero, vehicula id, consequat sed, tincidunt nec, purus. Class aptent taciti
sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Suspendisse potenti.
Nunc vulputate magna non magna. Aenean lorem eros, adipiscing quis, semper non, dictum a,
nunc. Curabitur ut sem. Pellentesque a est id neque hendrerit ultrices. Donec vulputate tincidunt
turpis. Curabitur dignissim vestibulum nunc. Aliquam felis lorem, ultrices sit amet, convallis a,
accumsan vel, ante. Proin aliquam turpis sed augue. In pellentesque, magna a pulvinar adipiscing,
est orci adipiscing felis, sed laoreet urna magna quis neque. Proin facilisis aliquet urna.</b>
</p>
<p>
<b>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed
cursus feugiat mauris. Aenean pharetra purus a augue varius gravida. Aliquam gravida nibh ut nunc.
Integer tortor risus, posuere eget, rutrum non, semper a, tellus. Phasellus faucibus, elit nec egestas
adipiscing, sapien sapien lacinia nulla, et bibendum metus neque fermentum sapien. Etiam ante dui,
tincidunt ac, auctor eu, aliquet non, velit. Mauris enim libero, malesuada at, dignissim vitae, lobortis ut,
enim. Sed porttitor consequat eros. Morbi nec risus vitae diam sodales accumsan. Praesent ultrices
magna sit amet enim. Proin convallis ipsum non dolor. Donec eu tellus. Nam ut magna.</b>
</p>
</div>
<div id="rightcolumn"><h4>This is my rightcolumn</h4></div>
<div id="footer"><h4><p>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a>
</p>
</h4></div>
</div>
</body>
</html>
If you paste this code into the validater it is xhtml1-strict.
I got this to validate by pasting it into the css validator.
#body {
font-family:verdana,arial,helvetica,sans-serif;
font-size:16px;
Background: url(http://www.geocities.com/dvdljns/images/angel.png);
}
h4 {
margin:0px;
}
#container {
background-color:transparent;
border:0px solid;
}
#header {
background-color:transparent;
border-bottom:0px;
height: 60px;
text-align:center;
}
#leftcolumn {
float:left;
background-color:transparent;
height:450px;
width: 25%;
text-align:center;
padding-top:2px;
}
#centercolumn {
float:left;
background-color: transparent;
height:450px;
width: 50%;
text-align:center;
padding-top:2px;
overflow:auto;
}
#centercolumn p {
text-align:justify;
margin:20px;
}
#rightcolumn {
float:left;
background-color:transparent;
height:450px;
width: 24.9%;
text-align:center;
padding-top:2px;
}
#footer {
clear:both;
background-color:transparent;
border-top:0px;
height: 60px;
text-align:center;
}
If I type in this I can go to the file angel.png.
http://www.geocities.com/dvdljns/images/
But no way that I have tried to put that link into my css has allowed me to see the webpage with my background showing.
It is driving me crazy. everything I read says it should work. but it does not. Can someone figare out why.
Mon, 2005-10-10 09:13
#14
body-background in css
My earnest advice is to dump that awful geocities thing and get some real hosting there are just horrible bits of code throughout, why is there a link tag to a geocities stylesheet in the body?
I can't effect any changes to your page so have to conclude it's the crud that geocities inserts.
I would however optimize your image you simply can't have images that are 930k large, and check whether that is not a problem as well with perhaps permitted sizes or something, but most of all dump the free web space apart from anything it throws IE into quirks mode.
Hugo.
Mon, 2005-10-10 22:41
#15
body-background in css
Hugo wrote:
My earnest advice is to dump that awful geocities thing and get some real hosting there are just horrible bits of code throughout, why is there a link tag to a geocities stylesheet in the body?
I can't effect any changes to your page so have to conclude it's the crud that geocities inserts.
I would however optimize your image you simply can't have images that are 930k large, and check whether that is not a problem as well with perhaps permitted sizes or something, but most of all dump the free web space apart from anything it throws IE into quirks mode.
Hugo.
Here's where I am at now. I posted the webpage at. dvdljns.koolhost.com/
I cannot upload the image file but using the two hosts it shows up fine. In two days I will send money to webquary to host my pages.
As for as the 930k image. I have a comp here I use with a 28.8 modem connection and it loads in 3 seconds. Also keep in mind this is not really a website. The reason I want to start it is I keep downloading these templates to see the code and then I find out evan though some of them have a link to the validator they do not really validate.
1. It does not have a domain name.
2. It is not listed with a search engine.
3. It is just a way to get this stuff off my computor.
4. If something does not work right I know it is a problam with code and not windows.
Mon, 2005-10-10 22:50
#16
body-background in css
dvdljns wrote:
As for as the 930k image. I have a comp here I use with a 28.8 modem connection and it loads in 3 seconds.
I find that hard to believe. Even with a 1.5Mb connection like I've got, I'd very rarely pull down nearly 1Mb of data in 3 seconds.
Head over to http://www.websiteoptimization.com/ and see what they say about ideal file sizes for web delivery.
Mon, 2005-10-10 23:20
#17
body-background in css
Look I not only do not want to get bogged down on whether the timer on my comp is right. you miss the point I was trying to make.
I am not saying you are not right when you say that it needs to be smaller. I am saying that since this website is not meant to be visited right now, it does not matter.