, they are a block. [18:42:59] so basically you have

Lorem ipsum

…

amet

[18:43:24] Is there a way to make the Dolor Sit div enforce no new lines _before_ it? [18:43:25] and it looks exaclty as it woudl on any web page, not specific to the wiki [18:44:03] I don't know if I can convince my wiki admin to change the

cs [18:44:06] *css [18:44:11] Kind of, but you need to approach it from a different persective I think. wikitext is mainly a markup language that translates to HTML, it is not HTML itself. In that sense more like Markdown. all text is a block, and the default is a paragraph. [18:44:16] I promise it looks different tho [18:44:17] It will not change it. [18:44:24] on a regular HTML page all words are rendered on the same line [18:44:27] the CSS is fine. [18:44:37] however, if you look at the link from the wiki [18:44:40] I'd suggest not using floats for this [18:44:52] well, if you put `

Lorem ipsum

…

amet

` on a regular html page you get the same result as wiki [18:44:56] there is no single example that allows all the words on the same line [18:45:02] the issue is that you don't want the automatic paragraph you want your own custom one [18:45:14] so try writing

Lorem ipsum

…

[18:45:23] That's the problem tho - I can't do that [18:45:28] why not? [18:45:38] because the "dolor sit" bit will be generated by a template [18:46:00]

Lorem ipsum

…

[18:46:25] quick question: is there a reason the floating div needs to be in the middle of your content instead of, say, before it? [18:46:31] that will be called by the calling page inline in the middle of the calling page [18:46:46] k, but why [18:47:07] calling page could just move the call somewhere else, no? [18:47:07] Here is an example: [18:47:13] Wiki text: [18:47:19] I suggest changing that, instead of making it work. even if you end up with a solution, it will be nobody likes and is difficult to understand and change later. better to spend the complexity budget in our mind on something else. [18:47:42] If you need more information please contact {{username|johnsmith}} please [18:47:49] {{ Left thing }} Lorem ipsum {{template}}, is indeed better. [18:48:03] {{username|johnsmith}} would expand to a div that includes a picture of john and other stuff [18:48:14] I can't control {{ left thing}} [18:48:45] I mean everything is possible. "{{Username picture|alice}} Please contact {{user|alice}}."" [18:49:00] But yes, if you want to float from there, it will have to be its own paragraph or other type of block. [18:49:10] So wrap in a

from the start will work for you [18:49:11] can even wrap that into a {{contact}} template and just put {{contact|johnsmith}} which expands to what Krinkle wrote [18:49:43] indeed. "{{picture|{{{1}}}}} Please contact {{user|{{{1}}}}}." would be a wrapping template [18:49:50] I can only control the template. The callers will be calling it from wherever they wish [18:49:51] I'd suggest not using floats for this however, it tends to be a very fragile layout on different viewport sizes [18:49:57] or simply what you have now as

Please contact {{user|alice}} then.

[18:50:11] ^^ this is what I want to do [18:50:22] you have to add the

yourself in that case [18:50:24] but I can't do that, without having {{user|alice}} render on a newline [18:50:35] it's allowed in wikitext [18:50:37] remove newlines from your user template [18:50:53] and don't put any newlines before or after the template call on the page using the template [18:50:59] https://en.wikipedia.org/wiki/Wikipedia:Sandbox/DivsAndLineBreaks [18:51:02] it happens even without a template [18:51:15] exactly - and it doesn't generate new lines, IIRC [18:51:18] sorry [18:51:23] if you don't make your own paragraph, then "foo bar

quux" becomes

foo bar

quux

[18:51:23] it doesn't *include new lines [18:53:41] I tried the explicit

idea as well [18:53:45] it also is not working [18:54:04] https://patchdemo.wmflabs.org/wikis/3ac9606624/wiki/Sandbox [18:54:24] (Btw, I may not be able ask the callers to add their own

anyway, but I wanted to try it just in case) [18:55:17] note that f you have an image, it has alignment methods built-in, no need for an extra div [18:55:25] https://www.mediawiki.org/wiki/Help:Images [18:55:46]

inside

is not valid HTML, hence an inline [18:56:21] if you do that, you might not even need the manual

[18:56:57] Oh - good point, part of the reason for this complexity, is that the template _does_ include an image, which is sourced externally, and uses div based tricks to resize it [18:57:05] I know - it's getting uglier and clunkier [18:57:27] the client-side image resizing only works from a div [18:57:30] not a span :-( [18:58:25] Krinkle - I noticed in your example, that the float left has pushed the "dolor sit" in the middle to the left (start) of the line... [18:59:07] "the client-side image resizing only works from a div" [18:59:10] that doens't make sense [18:59:17] what resizing method is that? [18:59:28] the words "dolor sit" in my example are your image [19:00:01] same as the wikipedia sandbox, those are meant to go to the left right? [19:00:38] I don't understand. If you don't want the words (or image) to go to the left, why is there a float:left? [19:01:07] if you don't want anything to happen, then a or no element at all will make the text stay where it is. [19:01:23] if you only want some things to move, then the things not moving should be outside that span [19:01:45] I think you have all the pices you need, I have to go now. Good luck :) [19:02:21] Will share more details about client side resizing as FYI [19:03:53] Here is the sample code [19:03:55] https://dpaste.org/gVSh [19:04:00] which also relies on a CSS [19:09:18] This is based on https://stackoverflow.com/questions/19450262/mediawiki-set-external-image-width-by-value [19:24:30] Guest58: there's no reason that can't work on a . You may have to set display:inline-block; But I think using transform for this is quite tricky and messy. I'd recommend using Common.css (or TemplateStyles if installed) and use that to undo the width/height of the (as `.myclass img { width: auto; height: auto; }` ), then you can set your own width on the . [19:24:47] which is that brion recommended on that stackoverflow post basically [19:31:16] I tried it on a span (albeit naively as that is none of these areas (HTML/CSS) are my forte), and it didn't work - I will try with inline-block [19:32:00] I agree about the transform being messy - my access to common.css is limited (but not impossible, with some pleading my admin may approve) [19:32:44] AFAICT - I am using brion's suggestion exactly [19:33:17] are you recommending I use with a span instead, like so: {{{2}}}

[19:33:33] i.e. adding display:inline-block to the style of the span? [19:57:02] P.S. TemplateStyles also not installed [20:10:33] Krinkle - I tried your style with inline-block idea, and it looks like that would work! Thanks! [20:11:16] My next problem is to avoid the massive borders left behind by the client-side transform-based resizing; I'll try that over the weekend, and report back to this group with my findings [20:11:22] Thanks again everyone!