NineChime forum

Furry stuff, oekaki stuff, and other stuff.

You are not logged in.

#1 07-19-2009 07:50:02

CaseyCoati
New member

How to make Header picture show?

Code:

    #divtopleft { 
    width: 180px; 
    height: 140px; 
    background-image: url('space/binturong.jpg'); 
    margin: 0px 0px; 
    float: left; 
    padding: 0px; 
    }

Everything I added to the templates, background showed but the top image banner will not I even tried the whole url link in there too but it wont show at all, what did I do wrong?
Is there more I need to do?
And I even checked the picture url and it is right.

Last edited by CaseyCoati (07-19-2009 08:05:51)

Offline

#2 07-20-2009 07:42:42

Trunksi
Member

Re: How to make Header picture show?

I just compared this part with the one I was using and I noticed
I used a " instead of the '  at the image path

so maybe changing this

    background-image: url('space/binturong.jpg');


to this

    background-image: url("space/binturong.jpg");

might help... I dunno xD it's just one thing I thought that could be causing this

Offline

#3 07-21-2009 00:49:49

Waccoon
Administrator

Re: How to make Header picture show?

Floats can be troublesome.  Does anything show up at all if the float is removed?  Also, are you sure you're using this as an id instead of a class?  (<div id="divtopleft">).

Also, the quotes and double quotes are interchangeable, and they can even be omitted entirely if the path is URL encoded (which only affects spaces and special characters).

Offline

#4 07-21-2009 04:02:06

CaseyCoati
New member

Re: How to make Header picture show?

Float removed didn't show anything at all.
All I added is that code just like that to templates.
What is id how do you use it with that do you have to add something extra to the header file or another file??
All I wanted is that picture to the top left with top links next to it instead of links under.

Offline

#5 07-22-2009 02:12:45

Waccoon
Administrator

Re: How to make Header picture show?

You might have to use absolute positioning to make the links show up in a particular place.  A good reference on how to do this and other CSS styling is W3Schools.

Now, regarding the "id", there's two ways to classify an HTML element (such as <div>)...

The first way is with an element ID.  This is typically used for major sections of a web site, such as the header, footer, and main container, because there can only be one ID on an entire page.  This makes it easy to identify and manipulate with CSS, JavaScript, and so on.  IDs have special meaning that classes do not.  In CSS, an ID is identified with a hash symbol, as follows:

Code:

/* CSS: */
#main {
   bg-color: white;
}

<!-- HTML -->
<div id="main">
   Stuff!
</div>

A class is a set of properties that can be applied to multiple HTML elements.  Classes are less useful for advanced coding, but in a nutshell, have the same basic functionality as an ID:

Code:

/* CSS: */
.message_new {
   color: red;
}

<!-- HTML -->
You have <a href="blah" class="message_new">2 new messages</a> and <a href="blah" class="message_new">4 new posts</a>

It's possible that if you have more than one ID in your document, or you are using an ID (with a "#" symbol) with a class (<div class="">), then it may not work properly.  Make sure you're using "id" with an ID, and "class" with a class.

Offline

Board footer

Yep, still running PunBB
© Copyright 2002–2008 PunBB