CSS Problem

[EmmaGale]

I have just installed the FreeFind search engine and have uploaded my template and have added to the CSS they provided.

I have one problem with the search results and I am sure its something to do with the CSS but I cant seem to solve the problem.

www.northdorset-pct.nhs.uk/index1.htm

If you put something in the search box ive been using North Dorset, then the results are now lining up nicely apart from the very first result. The very first line will not seem to line up.

I would be grateful for any assistance.
Kind regards
Emma Gale

[paulhiles]

Hi Emma,

The culprit looks to be the class "search-results".
The class uses a padding-left of 25px and justifies the text, which is why you'll see some titles spread out across the whole line. Actually the search-headline seems to do a similar thing... now I look at it!
The "search-results" class is applied in a number of areas on your page, however because the search results themselves are virtually one long string punctuated by line-breaks, only the first result gets the formatting applied.

My advice is to take the justified setting out first, and possibly use the padding in the "search-form" class. Have you tried using Firefox with the web developer extensions?

Update: I've tried the above (in Firefox) and I didn't get the desired result. I might have to take a copy of your page and work on it locally. Anyway I'm sure speed will be along in a minute, and solve the problem for you! :o)

[speed]

<font class="search-results" face="arial,verdana,geneva,lucida" size="-1"> is the culprit and the closing </font>.

I looked at this the other day but Paul beat me to the post and I thought he'd fixed it, so I didn't post.

From memory you need to change:
<font class="search-results" face="arial,verdana,geneva,lucida" size="-1"> and it's closing </font>

to:
<div class="search-results" style="font-family: arial,verdana,geneva,lucida; font-size: -1"> .... </div>

You will find that causes the search results to indent by 25 pixels, but they all line up.

The solution to the indent is to create a new class combining 'search-results' and the inline style, and remove the 25px left padding from the new combined class.

If it doesn't work let me know and I'll grab the page and work out the combined class again.

[speed]

The combined class to add to your CSS file is:

.search-results2 {
font-family: arial,verdana,geneva,lucida;
font-size: 0.9em;
text-align: justify;
}

and the <font> tags I mentioned before change to:
<div class="search-results2"> .... </div>

That works for both IE6 and Firefox, when I view a grab of your search results.

Off topic you have something like 109 syntax errors in the page which will need fixing.

[EmmaGale]

Thanks guys for your help.

I havent been able to make your suggested changes Speed - cant get onto my machine today but will try tomorrow and I think that answers it: I dont really want the indent at all. I want them lining up to the left.

In any case, I dont think that I can create a new class. The process is that I upload my template to the FreeFind server which has the search results applied to it by them and then it is returned when the user clicks the find button. (I hope I am making sense).

http://Off topic you have something ...l need fixing.

Are these errors within the template? I dont think i can do anything about syntax errors produced by the search engine can i?

Kind regards
Emma Gale

[speed]

If you can change the <font></font> block to a <div> block then you can add the new class I gave you as the template references the CSS on your server.

If you can't edit the <font> to <div> then you need to remove the padding-left from the search-results class, but this will affect other elements of your page, but you might be able to use a different class for those. At that point it's probably best if you make the raw template visible somewhere (or PM me and I'll give you an email address to send it to) so I can see what is and isn't generated.

I think you have a missing </p> in the template.

Some of the errors can be bypassed by changing the DOCTYPE to HTML4 rather than XHTML, while others are probably generated by the search and there is little you can do about them apart from complain to FreeFind.

[EmmaGale]

Ahah - not entirely sure becuase I cant try it out yet but after having looked at your solution again i dont think i can change the font to the div.

What they provide you with is a list of the class names that they use within the search results. Anything that requries alteration is modified within the main CSS style sheet which supercedes their original styles. All they receive from me is a blank template to which certain areas are marked with :::title::: and :::content:::.

If I remove the 25px padding left from the search results then everything moves over to the left hand side - squashing up to the nav bar.

I shall have a look for my missing </P>

WOWWWWW if i go for W3C validation there are currently 740 errors. They are not mine - my templates validate and the rest of the site apart from one or two hiccups are ok.

Can i change the doctype for just one page?

I will PM me if you let me know what you want me to send you. Though you probably wont hear from me until tomorrow.

Thank you for your help.
Kind regards
emma gale

[speed]

Can i change the doctype for just one page?

Yes!