• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 415
  • Last Modified:

Where does extra line break come from?

Under the presidentIQ Lite image here http://www.cygen.com/, there is an extra line break.  The word "Lite" should be just under the image, like the one to the left.  I've included a screenshot using IE Developer Toolbar.  Where is the extra #text coming from?  What is causing the weird line break?
phantomBR.png
0
brettr
Asked:
brettr
  • 6
  • 3
  • 2
2 Solutions
 
justin-clarkeCommented:
http://www.cygen.com looks fine in Firefox, in IE6 looks fine (as in no #text) but the images are mis-aligned.

#text in a css stylesheet would refer to an ID, i.e, id="text" in the HTML code.

I'm guessing this is done in .NET ? It may be that some tag in the css isn't closed properly ?


That's the code I get when viewing source and there's no #text in there
<div id="presidentIQLite" style="float:left;margin-left:20px;margin-right:40px;font-size:smaller;">
<img id="_ctl0_PageContent_Image1" src="presidentIQ/images/PresidentIQ5757Lite.png" alt="Memorizing the presidents has never been easier." style="border-width:0px;" />
<br />Lite
</div>
<br /> <br />
Be surprised at how quickly you can memorize all the presidents
<br /><br />
0
 
abelCommented:
The #text means a text node, probably only with whitespace. It is there because you have whitespace in the (X)HTML structure and it is usually good to have it there.

The extra white line you see after applying the CSS has to do with something else, but I don't see it in FireFox. It looks like a common IE mishap though, hold on.
0
 
abelCommented:
@justin-clarke: I think the OP is using an object/xml browser to visualize the HTML, the #text is not an element.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
justin-clarkeCommented:
abel okie doke!

Just figured in the image you have..

#text
<BR>
#text
<BR>

so those will be making your line breaks.

I guess the word "Lite" is below the 2nd <BR> in the image you have shown. Still doesn't make much sense why it's giving a couple of <BR> tags in the IE version you are using..
0
 
abelCommented:
Change line 61 in the following and remove line 62 and the extra (erroneous by IE) whitespace will go:

<img id="_ctl0_PageContent_Image1" src="Q_24324214%20(CSS%20extra%20whitespace%20line)_files/PresidentIQ5757Lite.png" alt="Memorizing the presidents has never been easier." style="border-width:0px;" /><br />
Lite

Open in new window

0
 
abelCommented:
It's a typical IE quirk and it is supposed to have gone with IE8, where whitespace handling is improved. But in IE7 it is still apparent. Even though this whitespace is considered irrelevant whitespace, IE7 apparently things otherwise and parses it different then the standard compliant browsers.

-- Abel --
0
 
abelCommented:
sorry, the links in my post with urls were the downloaded links and have been tampered with to make it available locally. Here's the real source (and it is line 63/64)

<!-- change this -->
<img id="_ctl0_PageContent_Image1" src="presidentIQ/images/PresidentIQ5757Lite.png" alt="Memorizing the presidents has never been easier." style="border-width:0px;" />
<br />Lite
 
 
<!-- into this -->
<img id="_ctl0_PageContent_Image1" src="presidentIQ/images/PresidentIQ5757Lite.png" alt="Memorizing the presidents has never been easier." style="border-width:0px;" /><br />
Lite

Open in new window

0
 
brettrAuthor Commented:
@abel:

In post  ID 24148405, what is the difference?  You are still using a <br>.  I'm not sure what image you are using there either.
0
 
brettrAuthor Commented:
Ok, fixed.  I was using Visual Studio.  There was a line break in the designer just after the image but that was a WYSIWIG thing and shouldn't have been translated into a <BR>.  Thanks.
0
 
brettrAuthor Commented:
Sorry abel.  I didn't see that you can two sets of code.  But the issue was actually with Visual Studio 2008.
0
 
abelCommented:
glad you found it. Like I said earlier, the line break is normally not a problem. However, in IE it can result to strange behavior... (and tricky to track down).

> In post  ID 24148405, what is the difference?  

the <br /> at the end instead of on the next line. See 24148468.


0

Featured Post

[Webinar] Database Backup and Recovery

Does your company store data on premises, off site, in the cloud, or a combination of these? If you answered “yes”, you need a data backup recovery plan that fits each and every platform. Watch now as as Percona teaches us how to build agile data backup recovery plan.

  • 6
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now