[Bug] [1.9.0-3b]: CSS for centering of images doesn't work

[mimcmillan]

What happened?

Problem

Create a custom CSS snippet with this:

img[alt*="center"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

Now in a note in Obsidian try to center an image with this line:

![center](IMG_01.JPEG)

In Obsidian the result is a centered image, but in the plugin output HTML the image is not centered, it’s still at the left.

Workaround

I’m able to inject the centered image directly in HTML by including this in the note in Obsidian:
<img alt="center" src="C:\file_location\IMG_0005.jpeg">

In the plugin output HTML, the image is now correctly centered.

The workaround works, but I think the normal Obsidian syntax should be supported here. And the custom CSS in question is pretty standard?

Also, for reference: if you remove [alt*="center"] from the CSS, so all images should now be centered, still the plugin output does not have it centered.

Reproduction

See above.

Last Working Version

No response

Version

1.9.0-3b

Operating System

Windows

Obsidian Version

Current: v1.7.7, installer: v1.6.3

Which browsers can you reproduce this in?

Chrome, Microsoft Edge

Relevant log output

Settings:
{
  "settingsVersion": "0.0.0",
  "exportOptions": {
    "createDocumentContainer": true,
    "keepModHeaderFooter": false,
    "addPageIcon": true,
    "unifyTitleFormat": true,
    "createPusherElement": true,
    "makeHeadersTrees": true,
    "postProcess": true,
    "displayProgress": true,
    "inlineHTML": true,
    "exportPath": "C:\\Users\\mcmil\\Documents\\mimcmillan.github.io\\log\\bin\\41982475928734",
    "addBodyClasses": true,
    "addMathjaxStyles": true,
    "addHeadTag": true,
    "backlinkOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "Backlinks",
      "featurePlacement": {
        "selector": ".footer",
        "type": "start"
      }
    },
    "tagOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "",
      "featurePlacement": {
        "selector": ".header .data-bar",
        "type": "end"
      },
      "showInlineTags": true,
      "showFrontmatterTags": true
    },
    "aliasOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "",
      "featurePlacement": {
        "selector": ".header .data-bar",
        "type": "start"
      }
    },
    "propertiesOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "Properties",
      "featurePlacement": {
        "selector": ".header",
        "type": "start"
      }
    },
    "fileNavigationOptions": {
      "enabled": false,
      "unavailable": true,
      "displayTitle": "",
      "featurePlacement": {
        "selector": "#left-sidebar-content",
        "type": "end"
      },
      "showCustomIcons": false,
      "showDefaultFolderIcons": false,
      "showDefaultFileIcons": false,
      "defaultFolderIcon": "lucide//folder",
      "defaultFileIcon": "lucide//file",
      "defaultMediaIcon": "lucide//file-image",
      "exposeStartingPath": true,
      "includePath": "site-lib/html/file-tree.html"
    },
    "searchOptions": {
      "enabled": false,
      "unavailable": true,
      "displayTitle": "Search...",
      "featurePlacement": {
        "selector": "#left-sidebar .topbar-content",
        "type": "start"
      }
    },
    "outlineOptions": {
      "enabled": true,
      "unavailable": false,
      "displayTitle": "Outline",
      "featurePlacement": {
        "selector": "#right-sidebar-content",
        "type": "end"
      },
      "startCollapsed": false,
      "minCollapseDepth": 0
    },
    "themeToggleOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "",
      "featurePlacement": {
        "selector": "#right-sidebar .topbar-content",
        "type": "start"
      }
    },
    "graphViewOptions": {
      "enabled": false,
      "unavailable": true,
      "displayTitle": "Graph View",
      "featurePlacement": {
        "selector": "#right-sidebar-content",
        "type": "start"
      },
      "showOrphanNodes": true,
      "showAttachments": false,
      "allowGlobalGraph": true,
      "allowExpand": true,
      "attractionForce": 1,
      "linkLength": 15,
      "repulsionForce": 80,
      "centralForce": 2,
      "edgePruning": 100,
      "minNodeRadius": 3,
      "maxNodeRadius": 7
    },
    "sidebarOptions": {
      "enabled": true,
      "unavailable": false,
      "allowResizing": true,
      "allowCollapsing": true,
      "rightDefaultWidth": "20em",
      "leftDefaultWidth": "20em"
    },
    "customHeadOptions": {
      "enabled": false,
      "unavailable": false,
      "displayTitle": "",
      "featurePlacement": {
        "selector": "head",
        "type": "end"
      },
      "sourcePath": "",
      "includePath": "site-lib/html/custom-head.html"
    },
    "documentOptions": {
      "enabled": true,
      "unavailable": false,
      "allowFoldingLists": true,
      "allowFoldingHeadings": true,
      "documentWidth": "40em"
    },
    "rssOptions": {
      "enabled": false,
      "unavailable": true,
      "siteUrl": "",
      "siteName": "xTensiv Vault",
      "authorName": ""
    },
    "relativeHeaderLinks": false,
    "includeJS": true,
    "includeCSS": true,
    "inlineMedia": true,
    "inlineCSS": true,
    "inlineJS": true,
    "inlineFonts": true,
    "inlineOther": true,
    "combineAsSingleFile": false,
    "offlineResources": false,
    "themeName": "",
    "slugifyPaths": false,
    "flattenExportPaths": false,
    "fixLinks": true,
    "faviconPath": "",
    "iconEmojiStyle": "Native",
    "exportRoot": "Probability",
    "includePluginCss": [
      "obsidian-list-callouts",
      "callout-manager"
    ],
    "includeStyleCssIds": [],
    "autoDisposeWebpages": true
  },
  "logLevel": "warning",
  "titleProperty": "title",
  "rssDateProperty": "date",
  "onlyExportModified": true,
  "deleteOldFiles": true,
  "exportPreset": "raw-documents",
  "openAfterExport": false,
  "filePickerBlacklist": [
    "(^|\\/)node_modules\\/",
    "(^|\\/)dist\\/",
    "(^|\\/)dist-ssr\\/",
    "(^|\\/)\\.vscode\\/"
  ],
  "filePickerWhitelist": [
    "\\.\\w+$"
  ]
}

Enabled Plugins:
	Templater
	Advanced Cursors
	Advanced Tables
	Copy Block Link
	Homepage
	Linter
	PDF break page
	Quick Switcher++
	Recent Files
	Settings Search
	Style Settings
	Text Format
	Underline
	Creases
	List Callouts
	Quick Latex
	BRAT
	Callout Manager
	Better Export PDF
	Webpage HTML Export

Additional Info

No response

[KosmosisDire]

Thanks, I will see if I can reproduce this and fix it