Alignment images through spaces #39

Closed
Sorbing opened this Issue Jul 31, 2012 · 13 comments

Comments

Projects
None yet
4 participants
@Sorbing

Sorbing commented Jul 31, 2012

Alignment images with spaces, as in the dokuwiki eg:

![ title](http://site.com/image.png) - left
![title ](http://site.com/image.png) - right
![ title ](http://site.com/image.png) - center

Or some other syntax..

@michelf

This comment has been minimized.

Show comment Hide comment
@michelf

michelf Jul 31, 2012

Owner

And what would be the HTML output for that?

I'd rather have a way to specify a class so you can hook style rules to it.

Owner

michelf commented Jul 31, 2012

And what would be the HTML output for that?

I'd rather have a way to specify a class so you can hook style rules to it.

@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Aug 1, 2012

Hook it good of course, but align image with style rules does not work - need a wrapper <P>.
Example:

![ title ](http://site.com/image.png)
translates to:
<p style="text-align: center"><img src="image.png" /></p>

Sorbing commented Aug 1, 2012

Hook it good of course, but align image with style rules does not work - need a wrapper <P>.
Example:

![ title ](http://site.com/image.png)
translates to:
<p style="text-align: center"><img src="image.png" /></p>
@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Aug 1, 2012

Although probably correct indentation set in URL:

![title text]( http://site.com/image.png )

Sorbing commented Aug 1, 2012

Although probably correct indentation set in URL:

![title text]( http://site.com/image.png )
@michelf

This comment has been minimized.

Show comment Hide comment
@michelf

michelf Aug 1, 2012

Owner

You don't need a wrapper:

img {
  display: block;
  margin: auto;
}

Beside, the image syntax is for inline images. Having it affect the enclosing paragraph probably isn't a good idea.

Owner

michelf commented Aug 1, 2012

You don't need a wrapper:

img {
  display: block;
  margin: auto;
}

Beside, the image syntax is for inline images. Having it affect the enclosing paragraph probably isn't a good idea.

@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Aug 1, 2012

Сentered can be so, In any case it would be convenient to align the image use minimal syntax (spaces or any attribute).
Although CSS hooks may also need.
How to align an image to the right , without the wrapper?

Sorbing commented Aug 1, 2012

Сentered can be so, In any case it would be convenient to align the image use minimal syntax (spaces or any attribute).
Although CSS hooks may also need.
How to align an image to the right , without the wrapper?

@NetzwergX

This comment has been minimized.

Show comment Hide comment
@NetzwergX

NetzwergX Aug 1, 2012

You can "align" it by floating it to the left and right.

You can "align" it by floating it to the left and right.

@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Aug 1, 2012

OK, but not practical for each image write style="display: block; float: right" - benefits markdown markup fade (disappear).

Sorbing commented Aug 1, 2012

OK, but not practical for each image write style="display: block; float: right" - benefits markdown markup fade (disappear).

@michelf

This comment has been minimized.

Show comment Hide comment
@michelf

michelf Oct 5, 2012

Owner

I'm not too trilled by the whole idea shown here. If we add a way to align images, it'll be through a way to add a class attribute that your stylesheet can hook to. This way you're no longer limited by left-, center-, and right-align: you can actually have any presentation you want for your images.

Feel free to reopen an issue for that if you want.

Owner

michelf commented Oct 5, 2012

I'm not too trilled by the whole idea shown here. If we add a way to align images, it'll be through a way to add a class attribute that your stylesheet can hook to. This way you're no longer limited by left-, center-, and right-align: you can actually have any presentation you want for your images.

Feel free to reopen an issue for that if you want.

@michelf michelf closed this Oct 5, 2012

@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Oct 5, 2012

I'm still hoping for an opportunity to align the image with a space character)
How to reopen an issue?

Sorbing commented Oct 5, 2012

I'm still hoping for an opportunity to align the image with a space character)
How to reopen an issue?

@michelf

This comment has been minimized.

Show comment Hide comment
@michelf

michelf Oct 5, 2012

Owner

I meant open a new issue about adding a class to images.

Owner

michelf commented Oct 5, 2012

I meant open a new issue about adding a class to images.

@Sorbing

This comment has been minimized.

Show comment Hide comment
@Sorbing

Sorbing Oct 5, 2012

Can you give an example of the syntax with the addition of the class?

Sorbing commented Oct 5, 2012

Can you give an example of the syntax with the addition of the class?

@michelf

This comment has been minimized.

Show comment Hide comment
@michelf

michelf Oct 5, 2012

Owner

It's likely to be done in a similar way than for headers in pull request #38.

Owner

michelf commented Oct 5, 2012

It's likely to be done in a similar way than for headers in pull request #38.

@aleemb

This comment has been minimized.

Show comment Hide comment
@aleemb

aleemb Jun 14, 2013

I love the idea of using spaces for alignment. Ended up here while Googling a good solution for it and it's the simplest way for non-techies to grok without getting into markup/css.

aleemb commented Jun 14, 2013

I love the idea of using spaces for alignment. Ended up here while Googling a good solution for it and it's the simplest way for non-techies to grok without getting into markup/css.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment