Image in table not displaying at full size

  • Author
    Posts
  • #2511619

    Hello,

    Having issues on my “Home” page of the linked business website and blog.

    I am trying to align the full sized image to the left and have the text beside it on the right.

    Table seems to work well to allow me to use the header tags on the links from the home page… but I cannot get the image to display at full size. I have tried width=400px and width=100% but neither seem to make a difference.

    Can anyone help? :)

    The blog I need help with is lindsaym4rgaret.wordpress.com.

    #2511746

    timethief
    Member

    Please consult you detailed theme description page with set up instructions here https://wordpress.com/themes/sela/ and note those for the Front Page Template.

    Here is the link for the live demo site https://selademo.wordpress.com/

    #2511758

    Hi there, Open that page in the page editor, switch to the Text tab and on the td for the text on the right, change the opening td tag to this.
    <td style="vertical-align: top;">

    #2511777

    Thanks thesacredpath! That helped with the text alignment.

    The photo to the left is still displaying as a thumbnail and not as it’s original 400×400… Know any code for that?

    #2511858

    When I have my browser window wider than the max width of the content area on your site, using Measurit, your image is coming out at 400px x 400px.

    What is happening (and this is an issue when trying to use tables in responsive width themes such as Sela) is that your image is staying at 400px square and ends up pushing your text content off the right side of the page.

    I would suggest creating a draft post of, perhaps, Traditional Wellness… and then put in all your text content and then put your cursor at the beginning of the text and then insert the image as left aligned. When you do it this way, the theme and WordPress software can adjust the image and the text and keep both optimal. Give that a test and see what you think.

    #2511867

    Hi again – thanks for your continued help.

    I made a new page “HOME (Draft)” – https://lindsaym4rgaret.wordpress.com/home-draft/

    The way it is laid out on that page now is how I first tried it, before attempting to use a table. I entered the text on the page and then inserted an image aligned to the left.

    It seems to work for showing the image at 400×400, however not all of the text and links will sit at the right side of the image the way I intend…

    #2511868

    Changed the “Page Template” type and that helped a bit! All of the text is together, but I cannot seem to get the links to join the rest of the text.

    The links are formatted as “Heading 5” which is the issue, I think. It is causing them to display on a new line, instead of beside the image.

    I suppose I could use the “Paragraph” format, but it definitely doesn’t make the links stand out as much…

    #2511892

    Ah yes, h1-h6 are headings and will not display inline in other types of text, such as paragraphs.

    You can add the text inline in the paragraphs and then enclose them in a span tag (from within the Text tab in the editor) with a CSS class such as this
    <span class="my-link">Your link code here</span>
    And then we can style that text by adding some CSS to your custom CSS like this example.

    .my-link {
    color: #cc0000;
    font-weight: bold;
    font-size: 110%;
    }

    The above is just some examples. You can change and add as desired to get the look you want. It could be added as inline CSS within the span tag, but having the styling for the links in the CSS means you can easily apply it in other places and in the future.

    #2511895

    Okay – thats an option… Definitely had to do a lot of reading just now, as I have never used CSS before.

    My understanding is that the custom CSS editor is only available if I upgrade to the Premium Plan – am I right?

    #2511909

    My understanding is that the custom CSS editor is only available if I upgrade to the Premium Plan – am I right?

    That is right, we can use a span tag with a style to do this also, but it requires you to add all the declarations to each one. This would be an example which would be added directly in the page or post within the Text tab.

    <span style="color: #cc0000; font-weight: bold; font-size: 110%;">The link code here</span>

The topic ‘Image in table not displaying at full size’ is closed to new replies.