 Problem with text and image alignment |
  |
| Kaydee |
 Aug 18 2012, 05:03 PM
Post
#1
|
|
Group: Members Posts: 4 Joined: 18-August 12 Member No.: 17,622  |
Hey, all:
I am having trouble making my images and text display in the spot I want them to go. All of the text in my paragraphs are displaying vertically, even though I've aligned them with "Right" or center, and my images won't move from the left side. Please help? kaydee  |
  |
 
|
| pandy |
Aug 18 2012, 05:43 PM
Post
#2
|
|
🌟Computer says no🌟  Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
We need to see the page to be able to help. Can you post the URL to it, please?
|
|
|
|
| Kaydee |
Aug 18 2012, 11:15 PM
Post
#3
|
|
Group: Members Posts: 4 Joined: 18-August 12 Member No.: 17,622 |
QUOTE(pandy @ Aug 18 2012, 06:43 PM)  We need to see the page to be able to help. Can you post the URL to it, please? Here's the code I'm working on: <!DOCTYPE html> <html> <body> <p style="float: left; width: 200px; font-size: 36pt; text-align: center; margin-right: 20px; padding-bottom: 0px;"><i>KAYDEE WRITES</i></p> <img src="Kay Author Pic.jpg" style="float: left; margin-center: 30px; margin-bottom: 20px;" width= 200 height= 200 alt="Kay Author Pic"/> <img src="book with pen.gif" width= 200 height= 200 alt="book with pen"/> <body <div style="background-image:url(bubble.gif);background-repeat:no repeat;width:200px;height:200px;"></div> <body= text="black" link="yellow" vlink="lime" alink="red" link="white" vlink="blue" alink="red"> <div align="right"><h3><a href="http://bookstore.xlibris.com/Content/Site302/FilesSamples/333575pdf_00000072966.pdf">To read an excerpt from my murder thriller, <i>"Hush, Little Baby"</i> click here!</a></h3></div> <align="right"><h3><a href="http://www.nolanchart.com/author1143-kaydee-barnett-and-then-theres-kaydee.html">To read articles in my viewpoint column, <i>"And Then There's Kaydee"</i> click here!</a></h3></div> </body> </html> |
|
|
|
| Darin McGrew |
Aug 19 2012, 02:12 AM
Post
#4
|
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
I recommend that you start by fixing the markup errors reported by the online validator. Ours doesn't understand HTML5 yet, so you'll need to use the W3C validator:
http://validator.w3.org/ Once you've fixed the structure of your markup, there are some other issues. For one, the align="right" attribute doesn't move the div element to the right of the previous img elements. All it does is change the alignment of the text so that the lines wrap flush right, ragged left. (Normal paragraphs like this one wrap flush left, ragged right. Perhaps this FAQ entry will help: http://www.htmlhelp.com/faq/html/images.html#align-image |
|
|
|
| Kaydee |
Aug 19 2012, 08:55 AM
Post
#5
|
|
Group: Members Posts: 4 Joined: 18-August 12 Member No.: 17,622 |
Thank you, Darin.
The tool pointed out my errors, including a few simple typos that I made. |
|
|
|
| Kaydee |
Aug 19 2012, 04:29 PM
Post
#6
|
|
Group: Members Posts: 4 Joined: 18-August 12 Member No.: 17,622 |
Hello,
I just figured out what the problem was all along with the above mentioned subject. I had downloaded a free background to use for my page. It turns out that the text is formatting just fine until I add this background to the document. As soon as I do, the images and paragraph text vertically aligns themsleves to the left. Is there a correction in the code that I should write in order for the image to take? |
|
|
|
| pandy |
Aug 19 2012, 04:52 PM
Post
#7
|
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
A background can't do that. But you making a mistake when you add it can. Can you show how the HTML looks now?
|
|
|
|
|
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 26th April 2024 - 05:13 AM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC