I'm having a problem using the ALIGN tag with images in my blog.
I can insert the photos normally with no problems. As long as the ALIGN tag is omitted, everything works fine.
When I put the ALIGN tag in the image and rebuild, the image vanishes. The space is carved out and the text wraps around but the image is no longer there.
Any ideas?
Full Version: Photo align problem
Not really a Moveable Type question, is it?
Still, if you gave us a link, perhaps we can see the HTML code and help?
Still, if you gave us a link, perhaps we can see the HTML code and help?
http://www.lurid.org
Totally work safe, nothing lurid there.
The image "shark.jpg" in the story at the top of the page works fine now. But if I add ALIGN="LEFT" it vanishes.
Totally work safe, nothing lurid there.
The image "shark.jpg" in the story at the top of the page works fine now. But if I add ALIGN="LEFT" it vanishes.
I remember a while back that someone using one of the blogstyles 3 column templates had a problem like this... The image was hiding under the background color of the #content section.
You can try the fix we found: in the #content section, remove the position:relative line.
Kristine
You can try the fix we found: in the #content section, remove the position:relative line.
Kristine
I am not sure which browser you are using but in neither Firebird nor Safari does it disappear. The only difference in adding the align attribute is that the text jumps up to the right of the picture.
By the way, I have no knowledge of their being a float attribute in XHTML transitional. Validation gives me this (plus a whole other slew of errors):
There are a lot of browser bugs when you write valid HTML or XHTML. There are even more problems when you don't.
So I would suggest that the FIRST thing you do anytime you see anything strange is validate your page.
There are really cool bookmarklets for this sort of thing, OR you can put this on any page and just click:
By the way, I have no knowledge of their being a float attribute in XHTML transitional. Validation gives me this (plus a whole other slew of errors):
CODE
Line 113, column 113: there is no attribute "float" (explain...).
...="420" height="272" border="0" float="left" /></p>
...="420" height="272" border="0" float="left" /></p>
There are a lot of browser bugs when you write valid HTML or XHTML. There are even more problems when you don't.
So I would suggest that the FIRST thing you do anytime you see anything strange is validate your page.
There are really cool bookmarklets for this sort of thing, OR you can put this on any page and just click:
CODE
<a href="http://validator.w3.org/check/referer" title="Validate this page's XHTML 1.1-Strict compliance">validate me</a>
That fixed the vanishing picture problem. Thanks!
But it exposed another issue. When I use ALIGN="LEFT" with the pic, the entry below is wrapping around the image as well.
Am I missing a
somewhere?
But it exposed another issue. When I use ALIGN="LEFT" with the pic, the entry below is wrapping around the image as well.
Am I missing a
Seems like I remember that this does it - add clear:both; into your .posted class; that will make the image end before starting the posted line.
Kristine
Kristine
What if I prefer to have my posted info at the top of my articles? Any other place I could include the "clear:both;" ?
BTW, I changed the pic properties to ALIGN="LEFT" so you can see the behavior to which I am referring.
BTW, I changed the pic properties to ALIGN="LEFT" so you can see the behavior to which I am referring.
I still dont see it so it must be a PC or IE (or both) problem...
As far as the clearing, you can put this in your style sheet:
.blogbody {
clear:both;
}
By the way, the validator is still showing 557 errors on the front page alone. Now anyone who has used the validator knows that that probably means closer to 10-15 errors. Due to the realities of parsing complex documents, one error can look like 10 to a computer. Still, that also means that it could look like 557 errors to your browser (and if you use WinIE, it may look like 10238...)
In fact, I betcha if you close your meta tags (by adding a space and / before the >) you may cut out a large percentage of those problems...
Also, nothing should come between the following two lines:
You have two (unclosed) meta tags in there...
Seriously... All of these things may not matter to you, but they matter a GREAT deal to your browser. If you don't want to have to worry abuot all of this, then you would be better off switching your DOCTYPE to something a bit more liberal like
Having an XHTML DOCTYPE tells the browser you will be giving it XHTML and not tag soup. Some major tenets of XHTML (outlined here) are:
1) Attribute values must be quoted
2) Tags with closing tags MUST be closed
3) Tags with no closing tags must be terminated with a /
4) Document must be well-formed (no mismatched tags) and attribute and tag names must be in lower case
blahblahblah
Go validate or change your DOCTYPE. You cant expect your browser to display your work perfectly if you've given it imperfect code.
As far as the clearing, you can put this in your style sheet:
.blogbody {
clear:both;
}
By the way, the validator is still showing 557 errors on the front page alone. Now anyone who has used the validator knows that that probably means closer to 10-15 errors. Due to the realities of parsing complex documents, one error can look like 10 to a computer. Still, that also means that it could look like 557 errors to your browser (and if you use WinIE, it may look like 10238...)
In fact, I betcha if you close your meta tags (by adding a space and / before the >) you may cut out a large percentage of those problems...
Also, nothing should come between the following two lines:
CODE
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
You have two (unclosed) meta tags in there...
Seriously... All of these things may not matter to you, but they matter a GREAT deal to your browser. If you don't want to have to worry abuot all of this, then you would be better off switching your DOCTYPE to something a bit more liberal like
CODE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
"http://www.w3.org/TR/html4/loose.dtd">
Having an XHTML DOCTYPE tells the browser you will be giving it XHTML and not tag soup. Some major tenets of XHTML (outlined here) are:
1) Attribute values must be quoted
2) Tags with closing tags MUST be closed
3) Tags with no closing tags must be terminated with a /
4) Document must be well-formed (no mismatched tags) and attribute and tag names must be in lower case
blahblahblah
Go validate or change your DOCTYPE. You cant expect your browser to display your work perfectly if you've given it imperfect code.
Thanks very much for your feedback!
Working on it now.
Working on it now.