Hi,

I trying to make a version af the 'HOT' badge that will display the word 'Annonce' (that means ad).

I only want to show the badge - not the title of the module. Please see the attached image.

I am not that skilled with CSS, so can someone here help me?

Thanks,
Bjarne

Hi

How far are you with this?

Do you have a link

Cheers
Paul

Hi,

I managed to change the word 'HOT' to 'Annonce', but I can not find a way to hide the module title and still show the badge.

www.altomcamping.dk/nyt_site/

Thanks,
Bjarne

On your site I can't find a page with a sidebar so this is from a local site on my machine

.annouce .module-inner:before {
position: absolute;
z-index: 20;
padding: 0px 4px;
font-size: 10px;
top: 15px;
right: 0px;
font-style: italic;
background: #333;
color: #fff;
line-height: 1.4;
}

.annouce .module-inner:before {
content: "Announce";
background: #0092b2;
}

You could merge those styles but thought it would be easier for you to see what is happening

You will also need to add a module class to the module in the case above I added annouce

Cheers
Paul

Thanks Paul, I really appreciate your help.

The CSS code almost did the job, but the badge is placed on the far right side of the screen and not at right site of the module. Can you telle me how to fix this?

www.altomcamping.dk/nyt_site/

Cheers,
Bjarne

ah I was only working with sidebars on this

I think you could knock off the right position but if you are adding several modules in a row this won't work either

Hi Paul,

Thanks for your help. It pushed me in the right direction. I came up with this, and it is working

Take care....


Cheers,
Bjarne

.advert,.nyt{position: relative;z-index: 1}

.advert h6,.nyt h6{visibility: hidden;}

.advert h6:after,.nyt h6:after,.advert h6:after,.nyt h3:after{position: absolute;z-index: 20;padding: 0px 0px;font-size: 10px;top: 20px;right: 20px;font-style: italic;background: #333;color: #fff;line-height: 1.4}

.sidebar .advert h6:after,.sidebar .nyt h6:after,.sidebar .advert h6:after,.sidebar .nyt h6:after{top: -10px}


.advert h6:after{content: "Annonce";background: #004080;visibility: visible;display: block}

.nyt h6:after{content: "OBS";background: #2c3e50;visibility: visible;display: block}}

No worries

Thanks for posting your solution

have just noticed you have an extra close bracket on the code snippet you added - just thought I'd mention it

Cheers
Paul