可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I am working on a website(this is my first website as a developer) and I was wondering if someone could help me align these to items next to each other horizontally. I don't know how to code HTML so I am completely unfamiliar with this. For the most part when developing sites I go and make due with what is online to help but this instance I am with your help.

The site is using WordPress and this is going to be a page. With a table from W-P Table reloaded and a Google map. Here is the code currently:

<p style="text-align: left;">[table id=4 /]<small></small></p><p style="text-align: right;">
<iframe src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=Avie's+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;aq=&amp;sll=41.375316,-71.831092&amp;sspn=0.006948,0.016512&amp;vpsrc=0&amp;g=100+Main+Street,+Westerly,+R+02891-2194&amp;ie=UTF8&amp;hq=Avie's+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;hnear=&amp;radius=15000&amp;t=m&amp;ll=41.379063,-71.831102&amp;spn=0.015457,0.027466&amp;z=15&amp;iwloc=lyrftr:m,9024240540147588029,41.375323,-71.831043&amp;output=embed" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="640" height="480"></iframe>
<small><a style="color: #0000ff; text-align: left;" href="http://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=Avie%27s+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;aq=&amp;sll=41.375316,-71.831092&amp;sspn=0.006948,0.016512&amp;vpsrc=0&amp;g=100+Main+Street,+Westerly,+R+02891-2194&amp;ie=UTF8&amp;hq=Avie%27s+SKi+Sports+100+Main+Street,+Westerly,+R+02891-2194&amp;hnear=&amp;radius=15000&amp;t=m&amp;ll=41.379063,-71.831102&amp;spn=0.015457,0.027466&amp;z=15&amp;iwloc=lyrftr:m,9024240540147588029,41.375323,-71.831043">View Larger Map</a></small></p>

回答1:

Typically when you want to line something up side by side on a page, you have two options:

The old school way - Use Tables (If you are using a program like Dreamweaver, this should be fairly easy - Insert > Table)
The better way - Using CSS. This may be a little harder for you to deal with since you said you have no experiencing working with HTML and I am presuming CSS.

The CSS way would require you to create a stylesheet with two divisions (divs). Here's an example of some code that would do that:

<style>
 #col1{ width:300px; float:left;}
 #col2 { width:300px; float: right;}
</style>

The above code would go between your <head></head> tags. Then in the body of your page, you would simply call the two divs:

<div id="col1">YOUR CONTENT</div>
<div id="col2">YOUR CONTENT</div>

回答2:

I had a similar problem. I tried to use the CSS route but failed. If you are using Wordpress the easiest way would be to place 2 columns in the section you want the division. then place one element in each and then target their HTML codes accordingly.