WordPress.org

Ready to get started?Download WordPress

Forums

Luminescence Lite
[resolved] Luminiscence Lite 1.1.9 alignment problem (15 posts)

  1. littlenoodle
    Member
    Posted 5 months ago #

    I am using Luminiscence Lite version 1.1.9 and experienced alignment problems with pictures.

    I write a text (justified) and insert a picture (centered). Save it. Preview it and both the text and picture is justified.

    I have to go into the html to insert <p style="text-align: center;"> to align the pictures.

    I find this really time consuming. Is anyone experiencing the same problem?

  2. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    I'm trying to duplicate what you are experiencing but unable to. On my local test site using version 1.1.9, I created a post, justified the post (the content), and also inserted an image between to paragraphs with the "align center" setting when I inserted it. I get justified content and the image is centered when I view the post on the front end.

    This is not happening for you?

    Could you please provide a link to a post or page that your image is not centering?

  3. littlenoodle
    Member
    Posted 5 months ago #

    unfortunately not. I got someone else to try it on a wordpress but different theme and it turned out alright, so I thought it was the theme that I am using.

    it is centering issue for me. I cannot use the button to center (and only happens when a picture is involved) but i have to go into the html and actually type out "<p style="text-align: center;">".

    this is my actual scenario text - picture - text...text is justified and picture centered. I do all these with the buttons available on the toolbar. When I preview it, the whole content and picture remains justified. I click on the picture properties and it still says center.

    I then go into html and type <p style="text-align: center;"> and have to insert </p> after the picture or else, I would get the text (justified), picture (center) and text beneath (center).

    how can I provide you with the link because this all happens in the draft stage?

  4. littlenoodle
    Member
    Posted 5 months ago #

    This is an example of my draft post in html...When I preview this, the pictures are all on left alignment.

    I press the center alignment button, save it then preview it, the picture defaults back to being left alignment.

    Unless I personally type in <p style="text-align: center;"> at the beginning of each picture.

    Thanks for looking into this!

    <style type="text/css"><!--
    P { margin-bottom: 0.08in; }A:link { }
    --></style>
    <p align="JUSTIFY">Japanese tofu should be available in any Asian grocery shop in a tubular form in the cold section. Tofu is not necessary a vegetarian ingredient in Asia. Very often, it is paired with meat for both flavour and texture to the dish.</p>
    <img class="size-medium wp-image-4946 aligncenter" alt="DSCF8294a" src="http://www.vi-vian.com/wp-content/uploads/2014/01/DSCF8294a-200x300.jpg" width="200" height="300" />

    <style type="text/css"><!--
    P { margin-bottom: 0.08in; }A:link { }
    --></style>
    <p align="JUSTIFY">Japanese tofu is particularly soft and not easy to handle. However, living abroad far from the achievable distance to my favourite dish makes me feel braver, encouraged and determined to tackle a difficult ingredient at home.</p>

    <style type="text/css"><!--
    P { margin-bottom: 0.08in; }A:link { } -->Japanese tofu is particularly soft and not easy to handle. However, living abroad far from the achievable distance to my favourite dish makes me feel braver, encouraged and determined to tackle a difficult ingredient at home.
    --></style><img class="aligncenter size-medium wp-image-4947" alt="DSCF8288a" src="http://www.vi-vian.com/wp-content/uploads/2014/01/DSCF8288a-300x200.jpg" width="300" height="200" />

  5. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    you shouldn't have to use the text alignment from the editor for the picture when you insert it. When you insert an image using the "Add Media" button, you select the image and before clicking to insert it into your post, there is an alignment setting in the lower right of the popup window. This is actually the method to insert the image. I'm taking it you are not using that?

    Here is a screenshot of what I get when I insert and center the image using the method I explained. I also tried it using the centering of text from the editor without going into the HTML tab view.

    Screenshot

    Still not able to duplicate what you are experiencing though.

  6. littlenoodle
    Member
    Posted 5 months ago #

    I did check on the alignment setting in the lower right of the popup window. It is by default "center".

    I posted the html format of one of my draft posts above.

  7. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    I just looked at your source code...you should not have this in your content:

    <style type="text/css"><!--
    P { margin-bottom: 0.08in; }A:link { }
    --></style>

    Here is a snippet of my html code:

    <p style="text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin a dignissim mi. Sed sit amet fermentum sem. In interdum pellentesque pellentesque. Vivamus molestie sem ut nulla dictum volutpat.</p>
    <p style="text-align: justify;"><img class="aligncenter size-full wp-image-2720" alt="image" src="path-to-image.jpg" width="400" height="267" /></p>
    <p style="text-align: justify;">Vestibulum sapien felis, elementum non condimentum et, dictum ut tortor. Phasellus elementum tincidunt commodo. Pellentesque et orci risus. Suspendisse adipiscing iaculis ipsum.</p>
  8. littlenoodle
    Member
    Posted 5 months ago #

    I am not sure how that code appears. I just tried uploading other pictures but did not see that code anymore.

    I looked at previous post and did not see that code neither.

    Anyhow, I deleted those code and it did not make any difference to the picture alignment.

    I normally write a document on open office. I copy and paste it into wordpress and upload pictures in between paragraphs. Will that have any effect on my alignment of pictures? I would guess not but this "way" when I create a new post.

  9. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    Unless content has inline styling, it shouldn't be affecting it. But it sounds like you don't, so there is something else not working for you if your inserted images are not centering.

    I honestly still cannot duplicate what you are experiencing and I tested this on my local test site using version 1.1.9, as you can see by the screenshot I provided earlier, the image is centered when I inserted it and set it to aligncenter with the text being justified.

    Here is another test I did with the live demo site:

    Centered Image

  10. littlenoodle
    Member
    Posted 5 months ago #

  11. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    Now I know... it's your Pinterest plugin you are using, or whatever it is. This is what is doing it:

    .pibfi_pinterest {
    position: relative;
    display: inline-block;
    }

    That class is using a display: inline-block and your image is wrapped in this, so the image alignment is being overwritten with that class from the plugin.

    <span class="pibfi_pinterest ">
    </span>

    To cancel that out, you need to add some custom css like this:

    .pibfi_pinterest {
    display: block;
    }

    ....but basically, that plugin's class that is being used is the cause of your problems.

  12. littlenoodle
    Member
    Posted 5 months ago #

    thank you so much for identifying this. I do not have very good computer skills. can you please guide me as to...

    1. where should i add this custom css,

    2. and why am I only experiencing this problem now when I had not made any amendments to the style or inserting/changing additional widget...

    many thanks for spotting the problem!

  13. littlenoodle
    Member
    Posted 5 months ago #

    I found the css for pintrest and have replaced the command that you suggested and voila, it worked! thank you s so much!

    my blog is now back to normal, phew! but why am I only experiencing this problem now when I had not made any amendments to the style or inserting/changing additional widget...?

  14. StyledThemes
    Member
    Theme Author

    Posted 5 months ago #

    You're very welcome and I am happy to hear everything is working for you again. To answer your question though, I would say it happened once you started using that Pinterest plugin, whether right at that point or after.

    However, what is important is that now you have everything working and your images are centering :)

  15. littlenoodle
    Member
    Posted 5 months ago #

    oh yes, thanks for spotting it again. I can resume my blogging!

Reply

You must log in to post.

About this Theme

About this Topic