Re: applying html classes to the "figure div on HTML export

[Matt Price <moptop99@gmail.com>]

On Thu, Sep 19, 2013 at 3:05 PM, Christian Moe <mail@christianmoe.com> wrote:
>
> Matt Price writes:
>
>> Hi,
>>
>> Is there a way to apply an HTML class to the the <div class="figure">
>> element which is generated around an image link on HTML export?
>
> I don't think there is...?
>
> What you /can/ do is wrap the image in a special block/custom div of your own, e.g. as
> follows (the "myfloat" name is arbitrary):
>
>   #+begin_myfloat
>   [[./picture.png]]
>   #+end_myfloat
>
> This results in:
>
>   <div class="myfloat">
>
>   <div class="figure">
>   <p><img src="./picture.png" alt="picture.png" />
>   </p>
>   </div>
>
>   </div>
>
> Then you style the div.myfloat class with CSS.
>
> If I understand your problem correctly, you can also wrap all the images
> that should go in a row in a single special block/custom div, e.g.
>
>   #+begin_myfloat
>   [[./picture1.png]]
>
>   [[./picture2.png]]
>
>   [[./picture3.png]]
>   #+end_myfloat
>
> Then style the figure children of such divs with
>
>   div.myfloat div.figure { ... }
>
> Does this work for you?

ah, that's cool.  I had just figured out another workaround, which was to add
:PROPERTIES:
 :HTML_CONTAINER_CLASS: multi-image
:END:

to the containing headline, and then add

.multi-image div.figure {float:left;}

to the CSS.  It seems to have worked for me so far.  But the syntax
you describe is easier and more flexible.  I'll try it out soon
thanks!

Matt


>
> Yours,
> Christian