Jump to content
Stef's Coding Community
Sign in to follow this  
MetaCry

Padding problem - Help

Recommended Posts

Hello dear fellow members of killersites.com

 

I have encountered a small problem that I need your help solving :(

 

Here is what I have done so far:

 

<!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>Rejuvenation</title>
<link href="css/style.css" rel="stylesheet" type="text/css"  />
</head>
<body>
<div id="wrapper">
<div id="topheader">
<img src="images/p_topheader.jpg" width="1200" height="220" alt="image" />
<p id="topheadertext">
Taking developing to the next level
</p>
</div>
<div id="header">
<img src="images/p_header.jpg" width="785" height="285" alt="image" />
</div>
<div id="navbar">
<div id="navtext">
<a  href="#">Home</a>
<a  href="#">Register</a>
<a  href="#">Forum</a>
<a  href="#">Guides</a>
<a  href="#">Vote</a>
<a  href="#">Donate</a>
</div>
</div>
<div id="blackspace">



</div>
</div>
</div>
</body>
</html>

 

@charset "utf-8";
/* CSS Document */

#wrapper {
background-repeat:no-repeat;
width: 1200px;
height: 1980px;
background-image:url(../images/p_bgimage.jpg)

}
#topheader {
position: absolute;

}
#header {
padding-top: 220px;
padding-left: 205px;

}

#navbar {
padding-top: 40px;
padding-left: 205px;
position: absolute;	
}

#wrapper #topheader #topheadertext {
font-family: Andalus, Verdana, Geneva, sans-serif;
font-size: 30pt;
color: #FFF;
position: absolute;
padding-left: 340px;

top: 120px;

}
#wrapper #navbar a {
font-family: Nyala, Verdana, Geneva, sans-serif;
font-size: 30pt;
color: #b4c087;
list-style: none;
   padding: 15px;
   text-decoration: none;




}

#blackspace {

width: 480px;
height: 45px;
background-image:url(../images/p_blackspace.jpg)

}




 

My problem is that when I try to apply padding to #blackspace, the image dissapears :/

Example:

#blackspace {

width: 480px;
height: 45px;
background-image:url(../images/p_blackspace.jpg)
       paddingä-left: 50px;

}

 

picture without padding:

http://gyazo.com/3e92bb491cc316272d51cc50a31b2816.png

 

with:

http://gyazo.com/0a90c7f8b5f04b857aca3dca12ade1d5.png

 

Why does it dissapear?

How do I fix it?

 

Regards, Alex

Share this post


Link to post
Share on other sites
background-image:url(../images/p_blackspace.jpg)

paddingä-left: 50px;

You need a closing ";" on the background-image line. Also, your "padding-left" has a strange character in it, but that could be a forum related issue that isn't actually present in your site.

Share this post


Link to post
Share on other sites

You need a closing ";" on the background-image line. Also, your "padding-left" has a strange character in it, but that could be a forum related issue that isn't actually present in your site.

 

Thanks Ben, the closing tag did it <3

And the "ä" was added by misstake when I was making this thread :/

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...