explore, express, experiment

figuring out how to do a dialog


LPerson: So what if you didn’t need any money? or recognition? what would you do?

Rperson: What I want is just shifting one voice to the right a bit, with some overlap in the middle … Okay, I fixed that in the basic html file, but it doesn’t render correctly from WordPress. What’s going on? Some interaction with the theme?

so here’s a plain paragraph block. How does it show up in the inspector? Hmmm. Just as paragraph. I bet that alignment setting in the block controls is what’s screwing that up in the blocks above.
Nah. that’s actually a good thing, a correct thing. alignment happens within the margins (I think).

Getting rid of the has-text-align-left classification got me messing with columns and blocks and HTML view and a bunch of other stuff. I don’t really know what I did. or didn’t do. And now the left margin seems to be shifting as I want it to, but the right margin doesn’t. So that’s kinda sorta right (no pun intended). That was messed up due to columns inadvertently added. Cleaned up, I’m back to no margins being shifted by the styles LDialog and RDialog.

But it does render correctly when I’m messing with the custom CSS from the dashboard. I’m definitely confused.

The view from the Customize portion of the Dashboard.
Compare this with the rendering at the top of the page.
<html>
<head>
<style>
.LDialog { 
	color: blue;
	margin-left: 0%;
	margin-right:25%;
}
.RDialog { 
	color: red;
	margin-left: 25%;
	margin-right: 0%;
}
</style>

</head>
<body>
<div class = "LDialog">
<p>
DS: Suppose that you didn't need money, or attention, what would you do?  First you'd relax a while, then
after that, <I> when you’re ready to be useful </I>, ...
</p>
</div>

<div class = "RDialog">
<p>
JRE: Oh really?  Is utility the deciding factor?
</p>
</div>

<div class = "LDialog">
<p>
DS: A few months ago, I decided to stop trying so hard to be useful. I needed a little more me-time. 
</p>
</div>

<div class = "RDialog">
<p>
JRE: Or maybe a lot more me-time? 
</p>
</div>


</body>
</html>


Leave a Reply

Your email address will not be published. Required fields are marked *