CSS - Need Help Inserting Logo

Hi,

I just installed Gallery on my website, and I'm trying to integrate it with the main theme of the rest of the site.

Well I'm having a problem with the banner overlapping the logo in FireFox. It renders fine in IE7 (surprisingly), but not in FF.

Have a look he
http://www.lightblu.com/gallery/main.php

un/pass: test/test

You can look at how I want it on the homepage, or anywhere else for that matter.

What am I doing wrong? I tried everything with no success.

Thanks guys
--Waj

Hi I really need help
I've added new template to my site and it's custom template(means it was on my web site provider)
BUT logo area is too small
And I also can't get rid of the picture that's in header and that came with template
The biggest problem is that I can't move logo area UP it's in same line always,it just increases down,when I try to make it bigger
I have NO idea about CSS coding so I really don't know how to fix it

HELP!!!

Hi

I am trying to insert a logo into my header at Site and here is the CSS code for the Header section:

Code:

/* HEADER */
#header h1{    
    font-family:Edwardian Script ITC;
    font-size:300%;
    font-weight:bold;
}
#header h1 a, #header h2{
    color:#000;
    margin-left:2em;
}
#header h1 a:hover{
    background:transparent;
    color:#000;
    text-decoration:none;
}
#header h2{
    padding-left:7em;
    font-size:120%;
    font-weight:bold;
    font-style:italic;
}

/* END HEADER */

I want to have this inserted which puts a logo icon exactly where I need it

Quote:
background-image: url(http://guayadeque.wikidot.com/local--files/start/guayadeque2.png);
height: 80px;
width: 80px;
position: absolute;
top: 5px;
left: 10px;


And this is exactly how I want it but no matter where I try to put it, it mucks up the entire Header.

Can someone shed some light on where that can go on the Header to be a logo icon in the position I want it?

I want to place the page title on the left and the pages logo on the right of the page. The logo must be directly accross from the title.

Can anyone suggest some CSS and html

Below is my feeble attempt

HTML:
<div id="header">
<p>Report Title
<span class="logo"><img src="logo.gif">
</span>
</p>
</div>

CSS:
#header p {
text-align: left;
}

#header .logo {
text-align: right;
}

I'm trying to get a dynamically populated logo to center in a div. I've found a solution which works in FF, IE7 and safari, but I've tried everything and I can get this to sit centered in IE6.

The html looks like this:

<div>
<table width="100%" height="100%">
<tr>
<td>
<a href="/somelink/">
<img src="dynamicallyGeneratated.jpg"/>
</a>
</td>
</tr>
</table>
</div>

The URL is sportsmembership.com.au/boxhillhawksfc/ and the logo is in the top left corner

The dtd is valid xhtml transitional, and IE6 is rendering in standards compliant mode. I've tried display block, and margin:0 auto on the image, and i've tried text-align center on the td, a and img tags, and I cannot get this to sit properly in ie6.

The image vertically aligns correctly but always sits to the left of the div, no matter what text-alignment I give it.

I can't find a way to center this with margins or padding because the image is dynamically called from a database, and can have different dimensions.

Hi,

I want to place a Logo and Banner in the header using CSS, i tried this but no use its not working properly.

PHP Code:
 div#main #header{
    width:100%;
    height:95px;
    text-align: center;
    background:url(images/top_bg.jpg);
}

div#header #header_title{
    text-align:left;
    font-family: Arial, Helvetica, sans-serif;
    font-size:25px;
    color:#ffffff;
    padding-left:20px;
    padding-top:20px;
}
div#header #header_title #banner{
    text-align:right;
    width:468px;
    height:60px;
    background:url(images/banner.jpg);
    background-repeat: no-repeat;
    padding-right:20px;
    padding-bottom:20px;
} 




Then i used this in html

PHP Code:
<div id="page">
<div id="header">
<div id="header_title">
Your Logo 
<div id="google"></div>
</div>

</div> 




But its not working properly, please please please help me....thanks...

vinodkv

My site is here...

css here...

I have two .gif files I want to use in the header... the main one (header.gif) should be centered (as it is now)... while the other (header_spread.gif) should repeat on the left and right sides of the centered header.gif... The .gif files are transparent, so I can't use the spread as the entire background... I'd also like to refrain from making header.gif (don't care about header_spread.gif) a background or making the background of header.gif white, and have it in an <img> tag instead so I can dynamically change my header with the seasons... (though if background is the only way, I could have a header class for each season and have my script change it, so that solution would technically work too, but create a larger css file.)

I need help formatting this properly... I can get the spread to work as a background for the entire div header, but that messes up the look of the center gif...

Thanks
Bryan

Hello,

I'm having some problems with with the menu and CSS.

I'm trying to retouch some aspects of my website, and the last think I need to do now is the menu.

Right now, here is how it looks like:
www.lightblu.com

You see the menu on the very top, then the logo below it, and then the banner below the logo. My users were "annoyed" by the amount of empty space between the top menu and the banner. Having thought of many possibilities, I encountered a template over at TemplateMonster, which is the exact menu I need. The reason I did not purchase it is that usually TM uses tables rather than pure CSS.

And here is the menu I'm talking about:
http://www.templatemonster.com/website-templates/18925.html

You see the menu?


And that's the exact same menu-concept that I'd like to have. Of course the background will be Black just as my website, rather than the greyish one you see at TM.

Now here is the problem I'm having. When I'm trying to align the logo with the menu, it just doesn't happen. I have the logo the on top left, which is fine, but then the menu appears below the logo on the right side. And I just cannot figure this thing out. Grrrr.. What am I doing wrong?

Thanks a ton guys!

I'm trying to get a search table to sit next to a logo, but the table is being placed below the logo. I'm not sure why it's being forced below, especially when there is no width defined.

Also, I would like the table converted into div's if possible, and I'm not quite sure how to do that.

Can someone take a look at this code and guide/tell me how to get this done?

you can view the page at http://66.201.102.201/headertest.hml

you should be able to grab the source. The logo is missing, but you can see the red X where the logo should be.

I just want the search stuff to be directly to the right of the logo, not below it.

Hi,

I'm new using CSS and was just handed the task of creating an external style sheet that will 'brand' the web page of a new service we are using with my company's logo and menu.

Our page has a logo on the left, with a menu bar extending to the right of it, then a graphic bannner with the company's slogan below all of it.

The requirements are for an external style sheet which will apply this to each page of the services hosted pages.

I desperately need an example of how this is done, or CAN it be done with an external style sheet (and what code needs to go into the HTML file to make it work).

Any help would be greatly appreciated. I've spent 4 days searching for an example and have come up dry, or what I did find didn't work. This is my last resort and I need to finish the project today.

Tillius

Hi,
Was wondering if there was any possible way to insert text into a webpage using CSS. I have a website created with over 200 pages so far, and the people I'm creating it for all of a sudden decided that they want a line at the bottom of each page stating their name. I have a CSS created for the background and I was wondering if I could insert a line in that sheet that would add the text to all pages. Is it possible or am I just dreaming? LOL. I'm trying to avoid having to go through all those pages doing copy/paste..hehe.

If this is not possible, any other ideas or help of any kind would be appreciated.

Thanks,
Christa

Hi, was wondering if someone could please enlight me on this.

Im creating what look like MS Word doc pages for a site and I would like to have it such that the body content div remains the same distance from the top and bottom of its container div regardless of whether header or footer divs are inserted into the same container div. How would I achieve this? Shall I use z-index in the .header and .footer classes and make them higher than the z-index of the .body class so as to stop them from affecting the margin of the body content div?

Thanks in advance.

Hi everyone,

I wasn't sure if I could do this with CSS or if I'd need to do something in my PHP to get this working. If it's not CSS, please could the mods move this to the PHP forum.

So here's my problem:

I have a site, www.geeknews.co.za, which is an article site that I want google adsense to run in. The problem is that the articles are inserted from the database dynamically, and I don't know how to add the google tags so that it doesn't appear after the article has finished.

The page on geeknews.co.za is a static page. Just so you can see what I'm going for.

Any ideas on how to do this?

Thanks

I took an example from w3.org (shown below) and it doesn't work.

From http://www.w3.org/TR/css3-content/
Quote:
4.2.2. Inserting multiple '::before' and '::after' pseudo-elements

In contrast with the previous section, the selector '::before(2)' represents a pseudo-element before another, both of which are contained at the start of an element.

For example, the following rules:

div { content: 'A' }
div::before { content: 'B'; }
div::before(2) { content: 'C'; }

...would result in the following rendering objects:

,-----------------------.
| ,---. ,---. |
| | C | | B | A |
| `---' `---' |
`-----------------------'

The '::before' selector is exactly equivalent to '::before(1)'.

A pseudo-element only exists if all the elements and pseudo-elements leading up to it exist. For instance, in the following example, only one pseudo-element is generated, the first one:

div { content: 'A' }
div::before { content: 'B'; }
div::before(2) { content: inhibit; }
div::before(3) { content: 'C'; }

It would result in the following rendering objects:

,-----------------------.
| ,---. |
| | B | A |
| `---' |
`-----------------------'



So my code is

Code:

<!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=iso-8859-1" />
<title>Test Page</title>

<style type="text/css" media="screen">
div { content: 'A' }
div::before { content: 'B'; }
div::before(2) { content: 'C'; }
</style>
</head>
<body>
<div>Test Div</div>
</body>
</html>

And the output is "BTest Div". Firefox error console comes up with
Quote:
Warning: Function token for non-function pseudo-class or pseudo-element, or the other way around, when reading 'before'. Ruleset ignored due to bad selector. Line: 10


I get a similar error when I validate it with W3.org using CSS level 3
Quote:
10 div Parse Error div::before(2) { content: 'C'; }


I just find it odd because I copied the example off of their site and then when I validate it the code comes back as invalid. Any ideas?