Work With Me Page

TVISSERTVISSER Registered Users Posts: 10 Beginner grinner
edited January 19, 2014 in SmugMug Customization
I am setting up the work with me page on my pro site. In the text, I want to put in pricing but have it in a table format so it is aligned. The page I am referencing is http://www.timvisserphotography.com/Work-With-Me - So far I have not found a way to do this. How do I customize the test so the information is uniformed? The attached screen shot will show the space version I did but is painful.

TIA,

Tim

Comments

  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited January 18, 2014
    TVISSER wrote: »
    I am setting up the work with me page on my pro site. In the text, I want to put in pricing but have it in a table format so it is aligned. The page I am referencing is http://www.timvisserphotography.com/Work-With-Me - So far I have not found a way to do this. How do I customize the test so the information is uniformed? The attached screen shot will show the space version I did but is painful.

    TIA,

    Tim
    Try this 
    <table style="margin-left: 60px; width:400px;">
<tbody>
<tr>
<td width=100><b>Baseball</b></td> <td>$100</td> <td width=100><b>Lacrosse</td> <td>$100</td>
</tr>
<tr><td>[I]&[/I]nbsp;</td></tr>
<tr>
<td><b>Basketball</b></td> <td>$125</td> <td><b>Soccer</b></td> <td>$100</td>
</tr>
<tr><td>[I]&[/I]nbsp;</td></tr>
<tr>
<td><b>Football</b></td> <td>$100</td> <td><b>Softball</b></td> <td>$100</td>
</tr>
<tr><td>[I]&[/I]nbsp;</td></tr>
<tr>
<td><b>Gymnastics</b></td> <td>$100</td> <td><b>Volleyball</b></td> <td>$100</td>
</tr>
<tr><td>[I]&[/I]nbsp;</td></tr>
<tr>
<td><b>Hockey</b></td> <td>$125</td> <td><b>Swimming</b></td> <td>$100</td>
</tbody>
</table>
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • TVISSERTVISSER Registered Users Posts: 10 Beginner grinner
    edited January 18, 2014
    Ok, that coding works perfect, thank you!

    When I did this it shows that the HTML placed under the text block works fine. However, when I try to place an image to the right of the top portion of the text, the image forces the HTML block below the image. How do I resolve this?
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited January 18, 2014
    TVISSER wrote: »
    Ok, that coding works perfect, thank you! Now the issue is, I want to remove the information where the text and replace with this coding. However, based on inserting the HTML block, it puts it way beneath the area that I want it. How can I move it up to replace the text table with the new HTML table?
    I don't see it working perfectly? Did you save the change?

    Sounds like you have blocks side by side and you want two on one side? Some folks have had luck
    with moving a block up using a negative top margin.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • TVISSERTVISSER Registered Users Posts: 10 Beginner grinner
    edited January 18, 2014
    Allen wrote: »
    I don't see it working perfectly? Did you save the change?

    Sounds like you have blocks side by side and you want two on one side? Some folks have had luck
    with moving a block up using a negative top margin.

    Yes, saving the changes without the image block to the right works great. However, with the image added after the HTML code, it moves it down. They should be two separate boxes and it should allow this. The goal is to have it like a word document with two columns. The left column is text and the right column is the image. I will want to do this for 3 other sections so I hope there is a way to make this work.
  • TVISSERTVISSER Registered Users Posts: 10 Beginner grinner
    edited January 18, 2014
    What do you mean by a negative top margin?
  • AllenAllen Registered Users Posts: 10,013 Major grins
    edited January 18, 2014
    Looks like the pricing block is a separate html block below both the two above, text and image.
    See if clicking the [strike]wrench[/strike] triangle ruler icon of the pricing block and setting the top margin to
    a negative number moves it up. Set the width so it fits in there.
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited January 18, 2014
    Allen wrote: »
    Looks like the pricing block is a separate html block below both the two above, text and image.
    See if clicking the wrench of the pricing block and setting the top margin to a negative number
    moves it up. Set the width so it fits in there.

    The negative margin is set with the triangle ruler icon, not the wrench icon. Ruler icon is to the left of the wrench.
  • TVISSERTVISSER Registered Users Posts: 10 Beginner grinner
    edited January 19, 2014
    ChancyRat wrote: »
    The negative margin is set with the triangle ruler icon, not the wrench icon. Ruler icon is to the left of the wrench.

    OK I will give that a try...thanks for the help everyone! :D
  • ChancyRatChancyRat Registered Users Posts: 2,141 Major grins
    edited January 19, 2014
    You might also need to set the container width for the block at the bottom, so it can "fit" and move up with the negative margin you apply.
Sign In or Register to comment.