|
HTML - Lowering Text Beside A Floated Image
Hi,
Could someone help me understand how to lower text that is wrapped around a floated image? Rather than using <br> to lower "Tall Ships Festival 2009" on this page: http://www.tall-shiprace.com/ I'd like to be able to use pixels. Any help very appreciated... Similar TutorialsCan we place an image just right to an image having the style float:left? If so how? I tried keeping but the second image was coming below the first image. <td colspan="4"> <img src="images/Subject.gif" style="float: left" /> <b>Subject - Craig TestFile</b> <img src="images/dot.jpg" class="imageUnderLine" /> </td> Also the is there any way to remove the spaces that come in between when we use <hr> tag? For example if we write test<hr> the seperator drawn is after a line break with text. here is the (ineffective) code currently: <img style="float: left; width: 169px; height: 73px;" src="img/logo1.png" alt="" /> <h1 style="text-align: center;">random text</h1> the image shifts the left margin such that the text is centered as though the page width was 169px less than it really is. i'm not debating the code itself; the code above behaves as its meant to. aka no surprises. i just cant figure out the appropriate code to center the text across the entire real width of the page as though there was no image. i've tried div tags & all the things google hunting advised. no luck. other than finding this forum, which seems like it'll be a boon! thanx in advance for advise/comments/feedback/help. I have seen this many times but can not figure how to do it. Its the transparent images or text in text boxes, one example of this is http://au.movies.yahoo.com/Coming+Soon/to-cinemas/ At the top right you can see that transparent yahoo image in the text box and when you click it it disappears then comes back? can someone tell me how this works? Thanks My client friend wants a links page with rollover emails that chage the main image of the page so he can have a different sketch of each of them. My idea, and its backfiring as I can do this if I change the email text into images with swap image and a target but he wants them to remain as copyable (mmm is that even a word?) text. Can it be done with text without making it an image? many thanks to all you wonderful people that make these sites possible jax Im trying to create a simple thing for my business. What im trying to do is have the image of each of my employees and under it have their name and other info. I want the images side by side with some space and able to put their info under it. Can someone help me with a html code? thanks! i'm trying to wrap my head around floats, and implement them into a new design i'm doing. basically it's a 4 column directory listing. it looks fine when the browser is >960px, but once you resize your browser so only two columns fit horizontally, the 3rd column appears below as desired BUT it is off to the right, and the 4th column is below on the left. once you resize your browser so only one column fits horizontally, it appears correct again. any tips to fix the layout when only two columns can fit horizontally? the site is here (css is in the header for now): http://cortlandareatribune.com/test/directory.html If anyone knows how to do this, please help... I am trying to place text over an image. My image is broken up into 2 images. I want the text to be over the top image while retaining the two images being together. Here is my html: <td align="center" valign="top"><table width="500" border="0" cellspacing="0" cellpadding="0"> <img src="top.jpg"><img src="middle.jpg"> What would the html be to accomplish this? Thank you Hi, I want to place some text over an image, however i don't want to set the image as a background, as the user should be able to print the image, along with the text. What i want is that a photo would have something like "copyright 2009" or something similar when it is printed. Can someone point me in the right direction (to the correct forum, link etc.) thanks and best regards, Joe Hi, I am relativeley new to web design, I am just wondering if there is a way for me to put text over an image in Dreamweaver. I made my layout in Photoshop, sliced it in Imageready and now have it open in Dreamweaver. Any help is much appreciated. Thanks -Danny Edit: Sorry, should've posted a screenshot to give you a better idea of what I mean.. Click the link to see what it is I want the text on.. The 'box' is a slice by the way. http://img396.imageshack.us/img396/3271/helpub8.jpg How can I, in a table, put text directly to the right of an image? When I try, the image is placed, and then there's plenty of space to the right, but the text goes to the bottom right corner of the picture. How can I have it like this: (x's represent the image) xxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx ← Text xxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxx I'd like to have them all on a center line so to speak, where the middle of the text is lined up with the middle of the picture, and the text is centered (the text will be in a column-like structure, not just one line as it appears above) Hi, I am new to the forum, and HTML. I have a website, but it built by someone else, who has since left the country, so I am trying to learn basic coding to do my own website work. My question is, how do I put an image on a page with text displayed on the image ? There is an image on the home page of my site, Lanna Charm, with text on it , and I have tried to create the same effect, without success. Is there an easy way to do this ? I found the image in "Assets", in the admin section, and I can reproduce it, but I want to use different images, with different text. Thank you, Mickmac How can I get text on top of an image? I can't use an absolute position. credmond8.awardspace.com/random.html The text on the footer img. Hello, I would like to know, how can I insert text on top of an image (the one with the baby), so that the text would be non stop there on the same position, even if you change browser width... URL: http://www.fkkt.org/gdemsa/domov.html Please help How do I type text on top of a image and have it look the same in IE and Firefox Heya, Im coding a site here in Dreamweaver CS3 and need some help. I have a sliced image from my made-in-photoshop layout, that is my content area. But In dreamweaver I cannot add text over it. Anyone have a tutorial or advice that can get me past this? Quote: <html> <head> <title>newv4</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="breakdownconspiracyinc.css" rel="stylesheet" type="text/css"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- ImageReady Slices (newv4.psd) --> <div id="site_layout"> <table id="Table_01" align="center" width="500" height="470" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="4"> <img src="images/area/name_area.jpg" width="26" height="470" alt=""></td> <td colspan="11"> <img src="images/area/logo_area.jpg" width="450" height="159" alt=""></td> <td rowspan="4"> <img src="images/fill/right_fill.gif" align="middle" width="24" height="470" alt=""></td> </tr> <tr> <td> <img src="images/fill/graphics-fill.jpg" width="42" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/Graphics.html"> <img src="images/buttons/button_graphics.jpg" border=0 width="73" height="17" alt=""></a></td> <td> <img src="images/fill/music_fill.jpg" width="31" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/music.html"> <img src="images/buttons/button_music.jpg" border=0 width="45" height="17" alt=""></a></td> <td> <img src="images/fill/film_fill.jpg" width="33" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/film.html"> <img src="images/buttons/button_film.jpg" border=0 width="30" height="17" alt=""></a></td> <td> <img src="images/fill/blog_fill.jpg" width="36" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/blog.html"> <img src="images/buttons/button_blog.jpg" border=0 width="33" height="17" alt=""></a></td> <td> <img src="images/fill/about_fill.jpg" width="33" height="17" alt=""></td> <td> <a href="http://www.freewebs.com/breakdowninc/pages/blog.html"> <img src="images/buttons/button_about.jpg" border=0 width="50" height="17" alt=""></a></td> <td> <img src="images/fill/end_fill.jpg" width="44" height="17" alt=""></td> </tr> <tr> <td colspan="11"> <img src="images/area/content_area.gif" width="450" height="270" alt=""></td> </tr> <tr> <td colspan="11"> <img src="images/area/copywrite_area.jpg" width="450" height="24" alt=""></td> </tr> </table> </div> <!-- End ImageReady Slices --> </body> </html> image: http://allyoucanupload.webshots.com/...57666093499606 I am building a site from scratch, and since I dont have images yet, I am using image placeholders. I havent used frames, which may be my issue, but I used separate images on top for buttons and then a large image in the middle, and then a couple more buttons as images on the bottom of the page. Now when I try to align the middle image to the right so i can put buttons on the left, everything on the bottom half of the page moves to the rght as well, instead of just the middle image. Why is this happening, should i be using 4 separate frames on this page for each section? i am not to familiar with them, so i havent used them so far. Also, alot of the functions for images arent available, is that because they are just image placeholders? Any help would be greatly appreciated. Thanks Hi! I'm only starting out learning HTML and I've already bumped into a problem. I'm trying to have an image on a page, followed by some text placed under the image, in another paragraph, but for some reason the image now hides part of the text (so 'Would you like to place an order or to request more information?' no longer comes up, and 'Send an email', which still comes up, no longer is a link, it's just plain text). The text could read alright before I added the image code. Here's the piece - I'm copying it all in case my mistake is further up, but the img part is almost at the bottom of the code. HTML Code: <html> <head> <title>Armando Escalante Photografia y Video</title> </head> <body background="hearts.bmp"> <h1 align="center"> Armando Escalante Photografia y Video </h1> <hr> <p>Welcome to Armando Escalante Photografia y Video's website. <br> <b>Your special moments live forever...</b> </p> <p> <a href="url1"> Gallerie </a> <a href="url2"> Video </a> <a href="paquetes.htm"> Paquetes </a> <a href="url4"> Contactez-nous! </a> </p> <p> <img src="Celine et tous.jpg" width="400" height="600" alt="Celine en famille>     </p> <p> Would you like to place an order or to request more information? <a href="mailto:sauleme@hotmail.com?subject=Info%20or%20order"> Send us an email! </a> </p> </body> </html> I have an image and some text which i would like to be grouped together as 1 object, is this possible and if so how? Also does anyone know of a html editor which allows you to edit the html in design view? Thankyou in advance for any help! I'm not sure if this has been covered somewhere, but I couldn't find it. I'm wondering if there's any way to get an image to pop up on a hover over text, not a link. If that's not specific enough, I have a page of staff members. I want to be able to move my mouse over the person's name and have a picture of them pop up. Is this possible? Hi All, This is probably a basic question to ask but for some reason i cant seem to figure it out, Basically what you can see below is a table width="850" and then another table inside that table with a width="425" as you can see i have set 4 back ground images which look perfect my problem is im trying to put wording over them images....i can get wording on the images but they wont go in the relevant position, i.e align="top" they align at the bottom! iv tried everything i can possibly think off.... HTML Code: <table border="0" cellpadding="0" cellspacing="0" width="850">
<tr>
<td>
<table width="425" border="0" cellpadding="0" cellspacing="0" align="left">
<tr>
<td height="163" style="background-image: url(/images/box1.png); background-position: left;
background-repeat: no-repeat">
<a href="/html/ExistingCustomers.aspx">APPLY HERE</a>
</td>
<td height="163" style="background-image: url(/images/box3.png); background-position: left;
background-repeat: no-repeat">
<a href="/html/ExistingCustomers.aspx">APPLY HERE</a>
</td>
</tr>
<tr>
<td height="163" style="background-image: url(/images/box2.png); background-position: left;
background-repeat: no-repeat">
<a href="/html/ExistingCustomers.aspx">APPLY HERE</a>
</td>
<td height="163" style="background-image: url(/images/box4.png); background-position: left;
background-repeat: no-repeat">
<a href="/html/ExistingCustomers.aspx">APPLY HERE</a>
</td>
</tr>
</table>
</td>
</tr>
<tr style="height: 15px">
</tr>
</table>
If some one can tell me how to do it this i would highly appreciate it, iv tried adding this HTML Code: <tr>
<td height="163" style="background-image: url(/images/box1.png); background-position: left;
background-repeat: no-repeat" class="WhiteSmall" valign="top"><b>Apply Now></b>
</td>
</tr>
So it aligns it at the top but still i need it in the top middle..... if there a way of saying Valign="top middle" ??? as im aware you can use background-position: left top maybe you can do the same for valign? Hope some one can help me thanks for reading and look forward to hearing from you |
|||||||