Media & Embeds
Image Element
Align image and SVG elements to vertical middle using the useImgElement composable.
Part of the Global Preset:
useImgElement is included in the Global Preset (useGlobalPreset) and you can configure it through the preset's img option. For most projects, applying it via the preset is the recommended approach.Overview
The useImgElement composable sets vertical-align: middle on img and svg elements, preventing the small gap that appears below inline images due to baseline alignment. This is a config-free composable with no customization options.
useImgElement
function useImgElement(s: Styleframe): void
styleframe.config.ts
import { styleframe } from 'styleframe';
import { useImgElement } from '@styleframe/theme';
const s = styleframe();
useImgElement(s);
export default s;
styleframe/index.css
img, svg {
vertical-align: middle;
}
This composable takes no configuration options, creates no CSS custom properties, and returns void. It targets both img and svg elements.