August 8th, 2006
01:15 AM
Neverside Newbie
Status: Offline!
A Few CSS Questions
I'm working on something with CSS and I have a few questions. As I get more questions, I'll continue this thread.
1. How do I get an empty div to show up? I have a div that only serves as a place holder for a background image. If I take the spacer out, it disappears. I could just place the image, but I want it to be changable through CSS, not the layout.
2. How do I get said tag to span the height of the entire page? For some reason, 100% height is only making it go 20 or 30 pixels in height.
http://akfg.no-ip.org/game/index.php
___________________
Signature Suspended as it is in violation with the signature rules
August 8th, 2006
06:08 AM
Oh Yeaa.
Status: Offline!
1. height: **px; width: **px;
that simple 
if your using an inline tag, use "display: block;" too.
2. height: 100%; doesn't work in css... or html...
___________________
scudworkz.com.
August 8th, 2006
07:55 AM
Neverside Newbie
Status: Offline!
Nothing to do with what I asked... It's alright though I solved my own problems. By the way, 100% height does work, you just also have to set it for every element(including the html element if you want Safari compatibility) from the ground up in order to get it to work as the entire viewport.
Anyway, I have another question. Can anyone tell why I'm getting that one pixel black line between the banner and the navbar/statbar? All of the borders, paddings, and margins should be at 0.
___________________
Signature Suspended as it is in violation with the signature rules
August 8th, 2006
02:00 PM
Lost in Berkeley, CA
Status: Offline!
Got the source/preview/page?
___________________
There is no theory of evolution. Just a list of creatures Chuck Norris has allowed to live.
August 8th, 2006
03:59 PM
Neverside Newbie
Status: Offline!
It's in the original post.
http://akfg.no-ip.org/game/index.php
http://akfg.no-ip.org/game/includes/style.css
___________________
Signature Suspended as it is in violation with the signature rules
August 9th, 2006
12:31 AM
Lost in Berkeley, CA
Status: Offline!
Oh my effin G, I'm blind, I'm sorry I didn't see that haha.
Interesting.... topic to make a site about :P, by the way.
Oh, and the 100% doesn't work, like coolaid said. You can't do that. I would rethink the way you are structuring this all out. Your background could be a single image tiled vertically and centered instead.
Your image (navtop) has an ID. Is that really used?
Try adding "float: right" to your statbar class in your css. If that doesn't work, enclose your header from your body content in "container divs" (like a "header" class and a "body" class), both having the property "clear: both."
___________________
There is no theory of evolution. Just a list of creatures Chuck Norris has allowed to live.
August 9th, 2006
10:45 AM
Jag är Gandalf den grå och den vite, men vem är du?
Status: Offline!
There is no reason to over-complicate things, something like this works equaly good (I'm removing the link soon, just for preview purpose).
Pardon the use of PHP BBCode tags, it's just because the other tags are broke.
<?php /* XHTML */ ?>
<!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="en">
<head>
<title>Welcome to "Cum Wars", where we are guzzling cum!</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="content-style-type" content="text/css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/main.css" />
</head>
<body>
<div style="height: 500px; width: 1px;"></div>
<!-- Remove the div above when you have actual stuff here, it's
just there to stretch the page far enough to show the header background. -->
<!-- Add clean and nice XHTML and content here. -->
</body>
</html>
<?php /* CSS */ ?>
html {
margin: 0; padding: 0;
background: #000 url(img/main-bg.gif) repeat-y center -198px;
/* The BG image has been adjusted upwards by 198 pixels to
make it fit correctly with the header */
}
body {
margin: 0; padding: 0;
background: url(img/header-bg.jpg) no-repeat center top;
}
Then just code the layout-containers and the content (and whatever else) over this.
I've attached the source, images, and folders below.
___________________
Neversidian, your staff is broken.
Last edited by Simon, August 9th, 2006 10:50 AM (Edited 3 times)
