Hi,
When my project is published I see that image toggles are not correctly aligned with the text.
The margin values are set on the element during publishing, so I cannot correct this in the CSS.
See the attached screenshot.
Where do I have to change it to get this right? In my case setting the margin top equal to the margin right gives the correct result.
Thanks for the help,
André van den Boogert
Realworld Software Products
Image toggle alignment wrong - can't change it in CSS
Moderators: Alexander Halser, Tim Green
Image toggle alignment wrong - can't change it in CSS
You do not have the required permissions to view the files attached to this post.
André van den Boogert
Realworld Systems
Realworld Systems
- Tim Green
- Site Admin
- Posts: 23182
- Joined: Mon Jun 24, 2002 9:11 am
- Location: Bruehl, Germany
- Contact:
Re: Image toggle alignment wrong - can't change it in CSS
Hi André,
Since the CSS for this is inline and there are no classes attached to the surrounding tags you really can't change this via CSS. The simplest way to do it is to edit your custom toggle icons and add or remove white space around the icon to move it into the correct position.
Since the CSS for this is inline and there are no classes attached to the surrounding tags you really can't change this via CSS. The simplest way to do it is to edit your custom toggle icons and add or remove white space around the icon to move it into the correct position.
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.
Tim (EC Software Documentation & User Support)
Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Re: Image toggle alignment wrong - can't change it in CSS
Hi Tim,Tim Green wrote:Hi André,
Since the CSS for this is inline and there are no classes attached to the surrounding tags you really can't change this via CSS. The simplest way to do it is to edit your custom toggle icons and add or remove white space around the icon to move it into the correct position.
This seems to me not the best idea. It appears to be that the padding is specified individually for every image in the project. This propagated by copying a template. The class is dropdown-toggle-item.
If I add padding-top and -right to this class I can do it right. There remains only the problem of removing the padding for every instance of the img.
Or do I miss something?
Regards and thanks,
André van den Boogert
André van den Boogert
Realworld Systems
Realworld Systems
- Tim Green
- Site Admin
- Posts: 23182
- Joined: Mon Jun 24, 2002 9:11 am
- Location: Bruehl, Germany
- Contact:
Re: Image toggle alignment wrong - can't change it in CSS
Hi André,
If you want to do it via the CSS for the icon that can also be achieved easily, but you should do it via the margin attribute, not padding. This is because margin can be negative, padding can't. Then you can use a negative bottom margin to move the icon down.
That will move the icon down by 3px. The other margin values are already 0 so they won't change anything.
If you want to do it via the CSS for the icon that can also be achieved easily, but you should do it via the margin attribute, not padding. This is because margin can be negative, padding can't. Then you can use a negative bottom margin to move the icon down.
You don't need to do that. You can override the inline CSS with the !important directive. Do it like this:There remains only the problem of removing the padding for every instance of the img.
Code: Select all
inline-toggle-icon {
padding: 0 !important;
margin: 0 0 -3px 0 !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.
Tim (EC Software Documentation & User Support)
Private support:
Please do not email or PM me with private support requests -- post to the forum directly.
Re: Image toggle alignment wrong - can't change it in CSS
Hi Tim,
I will do so. Thanks a lot for the help on this!
Regards,
André
I will do so. Thanks a lot for the help on this!
Regards,
André
André van den Boogert
Realworld Systems
Realworld Systems
- Tim Green
- Site Admin
- Posts: 23182
- Joined: Mon Jun 24, 2002 9:11 am
- Location: Bruehl, Germany
- Contact:
Re: Image toggle alignment wrong - can't change it in CSS
Update: The padding value also needs !important to override the inline settings. I've corrected it in my post above.
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.
Tim (EC Software Documentation & User Support)
Private support:
Please do not email or PM me with private support requests -- post to the forum directly.