custom css

This section is for questions relating to using the forum. Announcements on updates and any issues with the forum software may also be posted here occasionally.

Moderator: Tim Green

Post Reply
User avatar
jonesmark
Posts: 2
Joined: Fri Apr 15, 2022 3:44 pm
Contact:

custom css

Unread post by jonesmark »

I am new to H+M and have a quick question about how to write css for a border image. Normally, this works for me:

img {
border-width: 2px;
border-style: solid;
border-color: #012169;
}

When adding it to the custom.css, it produces no results. I've added an image transition to custom.css which works just fine.

What am I missing?
thanks,
Salle
User avatar
Tim Green
Site Admin
Posts: 22663
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: custom css

Unread post by Tim Green »

Hi Salle,

If that is the CSS file in your skin and not in your project (which won't get used when you apply a skin), my guess is that you need to override inline CSS in the images. However, there is another serious problem in your code: You are applying borders to ALL images in the entire project. That will also apply borders to icons in toggles and other unexpected places where you don't want them.

What you need to do is apply a class to the images you want to have borders on, and then use the class in your CSS. And in your CSS you need to use the !important attribute to override any inline CSS that HM may have applied. To apply the class, double-click on the image in the HM editor and enter an arbitrary class name in the HTML Class: field. Let's say your class is imgborder. Then you adjust your CSS code like this:

Code: Select all

img.imgborder {
border-width: 2px !important;
border-style: solid !important;
border-color: #012169 !important;
}
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
User avatar
jonesmark
Posts: 2
Joined: Fri Apr 15, 2022 3:44 pm
Contact:

Re: custom css

Unread post by jonesmark »

Hi Tim,
That was very helpful, thank you. I did not see the border applied to the image in the Editor, only after I published the project. I take it that is the normal behavior?

thanks again,
Salle
User avatar
Tim Green
Site Admin
Posts: 22663
Joined: Mon Jun 24, 2002 9:11 am
Location: Bruehl, Germany
Contact:

Re: custom css

Unread post by Tim Green »

jonesmark wrote: Mon May 23, 2022 3:27 pm I did not see the border applied to the image in the Editor, only after I published the project. I take it that is the normal behavior?
Yes, of course: The editor is XML, not HTML. Those are two completely different languages and CSS is only used in HTML and only in your output.
Regards,
Tim (EC Software Documentation & User Support)

Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Post Reply