Help - Search - Members - Calendar
Full Version: HTML Layering just need a line!
HTMLHelp Forums > Web Authoring > Markup (HTML, XHTML, XML)
achieversonly
PLEASE HELP! I know this is simple but I don't know how to do it without a WYSIWYG editor! Here's what I want it to look like http://www.atwconsultingpllc.com/custom/ANN.html

The problem is I am building this same look on a wordpress blog. When I copy and paste the html from that page it doesn't work because the editor I used to make that page is yahoo sitebuilder and its got all of this additional java script and css code that only work on my yahoo site.

So I used an online WYSIWYG editor and was able to build the table with the images in it BUT it doesn't allow me to layer the youtube video ON TOP of the middle image and the form ON TOP of the end image. I know this can be done with a simple <div code and without the table but I don't know how to do it!!! Here's what I have please just add the line for me to get this layer done... By the way, here's the wordpress blog this is going on... http://www.annfeinstein.com Here's everything I have please just give me the td or div language I need to add to layer the last two images...

<table cellspacing="3" cellpadding="3" style="border-collapse: collapse; width: 707px; height: 435px;">
<tbody>
<tr>
<td style="border: 2px solid black; vertical-align: top;"><img height="420" width="320" border="0px" src="http://annfeinstein.com/wp-content/uploads/2011/02/passion_rounded2.png" title="event" alt="event" /> <br />
</td>
<td style="border: 2px solid black; vertical-align: top;"> <img height="420" width="320" border="0px" src="http://annfeinstein.com/wp-content/uploads/2011/02/rounded_front-pg.gif" title="video_holder" alt="video_holder" /></td>
<td style="border: 2px solid black; vertical-align: top;"><img height="420" width="320" border="0px" src="http://annfeinstein.com/wp-content/uploads/2011/02/rounded_front-pg.gif" title="form_holder" alt="form_holder" /> </td>
</tr>
</tbody>
</table><em>
________________________________________________

Here's the youtube embed code...

<object style="height: 390px; width: 2900px"><param name="movie" value="http://www.youtube.com/v/pG3LuC2hR1A?version=3"><param name="allowFullScreen" value="true"><param name="allowScriptAccess" value="always"><embed src="http://www.youtube.com/v/pG3LuC2hR1A?version=3" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="290" height="390"></object>

_________________________________________________

Here's the form code from aweber:

<script type="text/javascript" src="http://forms.aweber.com/form/25/254761725.js"></script>



Darin McGrew
Here's a better way to create rounded corners, rather than positioning content on top of images:
http://www.alistapart.com/articles/customcorners/
http://www.alistapart.com/articles/customcorners2/
http://www.w3.org/Style/Examples/007/roundshadow
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2013 Invision Power Services, Inc.