Over a week ... dare anyone to find this!

Here's a screenshot. My problem concerns the space or element which would normally display the Welcome to the community message. Somehow I managed to have that section appear on top of the promo as opposed to within the promo constraints. I've been trying to get this cleared up for over a week now. It actually doesn't even matter where that message is located since I want to remove the entire element which contains the welcome to the community message.

See the space between the two horizontal reddish lines? That's where that message would ordinarily appear.
Firebug shows me the text and makes a reference to font size 11 on the common css which has nothing to do with this.
My altered promo image has no margin at all, those horses have a top border of ZERO.
The space that contains the text "welcome to the community" is located in an element that I can't find.
My goal is to reduce the margin above the horse image and below the "Hello Guest, Join, Login" down to zero as well.

How can I delete this element? This has been driving me nuts for over a week now. Anybody know? I'd prefer NOT to have to use the languages settings in order to delete the text itself since I'm not convinced that this would also remove the element containing that text at the same time. It's the element itself that has to go .....

Try adding this to the bottom of templates/base/css/common.css

#indexPhotoLabel .sys_title {
display: none;
}

See if that works.

EDIT:

Actually try just this instead.

#indexPhotoLabel {
display:none;
}

Are you sure about the common.css? I can't find it there but found it in the index.css instead.
I've been playing around in there with display none and margin 0 endlessly. Matter of fact, I got so frustrated that I commented out that entire section which still didn't help. At the moment it looks like this (in the index.css file):

#indexPhotoLabel {
#    height:82px;
#    line-height:82px;
#    position:absolute;
#    bottom:0px;
#    width:100%;
#    z-index:1;
#    background:transparent url(../images/opSplash.png) repeat-x scroll left top;
#}

Thats why i could not see it with firebug.

Here is a hint. Don't comment out a css section you want to remove. Add display:none to it instead. So uncomment it and make it look like this.

#indexPhotoLabel {
height:82px;
line-height:82px;
position:absolute;
bottom:0px;
width:100%;
z-index:1;
background:transparent url(../images/opSplash.png) repeat-x scroll left top;
display: none;
}


Now that hint is only for removing an entire section so it is no longer displayed.

Other settings within the section should be just changed to force a override.

Images can be hidden by replacing it with background:none or background-image:none;

Simply commenting things out may not have the effect you want.

Nope, that's why I had commented that whole section (and others) out, out of sheer frustration.
Here's a screenshot of what it looks like now, much worse than I had it looking before ....
Even with the display:none; added, now the whole thing, text included, is showing again.
Clearly that 82 px tall stripe now appears between the promo and the menu which is how this mess got started to begin with.

You must add display: none; to that section to hide it.

You say you added it, but firebug says it's not there. So verify you spelled it correctly.

It makes no sence, if i put display: none directly into firebug in that section, it goes away. So why it is not working for you makes no sense.

Also something else is weird.

Check you index.css.

firebug shows this at line 93.

Ok. i see i found this in my origional index.css. The display:none has to be in the proper spot for this to work.

I see this in my origional.

#indexPhotoLabel {
height:82px;
line-height:82px;
position:absolute;
bottom:0px;
width:100%;
z-index:1;
background:transparent url(../images/opSplash.png) repeat-x scroll left top;
}

#indexPhotoLabel div.sys_title,
#indexPhotoLabel div.label_thumb {
font-size:24px;
color:#333;
font-weight:bold;
text-shadow:0 1px 0 #FFFFFF;
letter-spacing: -0.02em;
}
#indexPhotoLabel div.label_thumb {
padding-left:10px;
position:relative;
float:left;
}

#indexPhotoLabel div.label_thumbnail {
padding-left:11px;
padding-top:7px;
position:relative;
float:left;
}



Add display none to the second section like so.

#indexPhotoLabel div.sys_title,
#indexPhotoLabel div.label_thumb {
font-size:24px;
color:#333;
font-weight:bold;
text-shadow:0 1px 0 #FFFFFF;
letter-spacing: -0.02em;
display:none;
}



If worse comes to worse. You can also try over riding it by placing this at the very bottom of the file leaving the others at their origional settings.

#indexPhotoLabel {
display:none;
}

Dang it, I just wrote a huge response with another explanation but the forum booted me out and lost it. However, to your credit I have to say that ...

YOU

ARE

THE

KING

Thanks a million, that finally did it. Now I'll be able to sleep at night again ....

Since when is the # symbol used for comments in CSS files?   Silly me.... I've been using    /*   */    all these years.   I would have sworn that the # symbol is used to designate an elements ID.

Yea, your right of course, and it did not even dawn on me.

You must have php on your mind today.  Anyways... I answered this very same question for this guy about a week ago.

Does it ever dawn on you guys that sometimes something is being done just for the heck of it as a last ditch effort? I generally utilize /** this to comment things out **/ but when I've been working on three or four related blocks on the same page and nothing seems to work, then I sometimes comment out an entire section just to see what would happen then. What's wrong with that ... as long as I don't leave things like that in the final version of the file?
Geeeez guys, gimme a break will 'ya?

RE:

I told you a week ago that the # symbol is not the correct way to comment out something in a css file.  You apparently ignored it.  You complain about the lack of support around here, but when somebody tells you the correct way to do something, you ignore the advice.... as evidenced by your first post in this thread.

MC's the one that claims he's an expert coder on html, java, flash and so on.  Commenting out a CSS file should be somethin' that's pretty simple, even when commenting out several lines/blocks.

Just do:

/**#indexPhotoLabel {
height:82px;
line-height:82px;
position:absolute;
bottom:0px;
width:100%;
z-index:1;
background:transparent url(../images/opSplash.png) repeat-x scroll left top;
}

#indexPhotoLabel div.sys_title,
#indexPhotoLabel div.label_thumb {
font-size:24px;
color:#333;
font-weight:bold;
text-shadow:0 1px 0 #FFFFFF;
letter-spacing: -0.02em;
}
#indexPhotoLabel div.label_thumb {
padding-left:10px;
position:relative;
float:left;
}

#indexPhotoLabel div.label_thumbnail {
padding-left:11px;
padding-top:7px;
position:relative;
float:left;
}
**/

And it's all gone.  Why in the world would you use the # on every friggin' line?  That would be friggin' nuts and time consuming to say the least.

No wonder you were referring to elements when this is fully CSS controlled.  Of course FB would find it an element coded like that.

I didn't ignore anything ... just hadn't changed anything on that file since then because I was dealing with plenty of other issues too, not just related to D7. Didn't get back to it until today. It wasn't that big of a deal since we're not actively promoting the site yet.

@mydatery
Don't you ever get tired of your own BS ... ???
Not only have I never claimed to be an "expert" but more importantly I've pointed out numerous times now that php is one of those things that I don't know a lot about. Instead of figuring more outdated methods of irritating people, why don't you spend more time here on the forums, actually helping others? Have either one of you noticed that the solution was already posted above by deano92964? Oh, darn it, shucks, I forgot that houstonlively doesn't like to read ... did intimate that in another topic ... my bad.

Thanks again for this, deano92964. I did have to make some adjustments to that code though ...
Also, the code below that in the general.css is where I had added some repeating background behind the logo text, but once I implemented your suggested changes that background no longer worked. However, the background image from the top of the common.css then took that area over. Same image, so that was perfectly fine.

div.sys_main_logo {
background-image:url('../images/0headtitle01.jpg');
background-repeat:no-repeat;
margin-top: 10px;
width:1203px;
margin-left:0px;
position:relative;
z-index:56;
height:75px;
}

I had to increase the total width in order to include not just the modified enlarged text logo on the left, but also the space between that and the quotes, as well as the space for the quotes themselves. Initially I started out with a margin:left of 204 which worked great. But when I reduced that to ZERO since I widened the text logo by 204px, then the quotes moved over to the left too, for some reason.
Well, whatever, I'm just really glad that it's perfect now. Couldn't have done it without you, no way no how ... THANKS.

You know MC they say that's it's bad to hold in a fart because it will just travel up the spine to the brain and come out as a shitty statement.  In this instance you've demonstrated how truth that fact really is.  This is not PHP, this is CSS (a layout type script not a functionality type script) and you claim to be an expert in Layout type scripting.  Hmmm... Methinks you need to spend even more time studying which items you claim to be an expert in. 

And if all else fails, keep the questions coming, simply for the entertaining purpose of reading HL and MD's reply

Love to read their answers, I learn a lot and it's more entertaining than Youtube