[HTML / CSS] Positioning

[Matty]

Okay, so I'm working on a website and this problem won't go away. I'm trying to get it so this "ribbon" is located on the right of the screen in the corner. But for some reason it won't even move from it's spot. Here's the code:

   	body {		
	background-color: #313840;
	font-family:Arial, Helvetica, sans-serif;
	
	#logo
	position:absolute;
	left:auto;
	right:auto;
	background:url(img/logo.png) no-repeat #313840; /* image, repeat, background color */
	
	#hiring {
		position: absolute;
		top: 100px; 
		right: 0px;
		background: url(img/hiring.png) no-repeat #313840;
		width: 100px;
   		height: 100px;
}

 

[greenowl]

#hiring {
   position: absolute;
   top: 0px; 
   right: 0px;
   background: url(img/hiring.png) no-repeat #313840;
   width: 100px;
   height: 100px;
}

When you "fix" a div or anything to a spot on the screen, it won't move at all. This is where you would use absolute to position it. You also don't want that extra semi colon in the background code.

The top, left and right are for positions, not for width/height (though, I'm unsure whether you meant to put it there). Let me know how this helps. I don;t see anything that can lead me to see the real problem so I can only guess.

 

[Matty]

Thanks for the help. The ribbon still won't move. I'll edit the post with my css that I have right now.

 

[greenowl]

Do you have a link to your web page or the entire html+css?
I might be able to tidy it up a bit (only if you post before tomorrow), because your css doesn't look correct sorry.

 

[Vi3tb0i2ty]

maybe a screen shot?

 

[Roamer]

maybe a screen shot?

How is this going to help? -.-

 

[Matty]

Do you have a link to your web page or the entire html+css?
I might be able to tidy it up a bit (only if you post before tomorrow), because your css doesn't look correct sorry.

That's all I have so far. In my index all I have is

<div id="hiring">image src </div>

 

[greenowl]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body,td,th {
	background-color: #313840;
	font-family:Arial, Helvetica, sans-serif;
}
#hiring {
   position: absolute;
   top: 0px; 
   right: 0px;
   background: url(img/hiring.png) no-repeat #313840;
   width: 100px;
   height: 100px;
}
-->
</style></head>

<body>
	<div id="hiring"></div>
</body>
</html>

Once again, you did not provide the whole thing. But this puts the hiring image in the top right of the screen (with a width and height of 100x100). I can't really do more if you don't help me. :s