Help with CSS problems please (and some others)

[thewoosh]

I am really impressed with the Flexform theme and would like to use it for all the sites I develop from now on, but I am finding that significant problems are occurring, which I need to overcome before I can go live with my current site next week. I have started several threads on some of these, but have received no reply, so I am now placing them all in this one, in the hope that a new thread will get some attention.
The problems include:

CSS (major!):
1. I am finding that often (but not always) additional CSS class style info that I add to Theme General Options, which works in Chrome and Safari, is ignored in IE and Firefox…

For example:
I have tried modifying the CSS for impact_text (the current style included in the theme) as follows (added custom CSS to the Theme General Options):
.impact-text {
font-size:14px !important;
}
but this works only in Chrome & Safari but not IE and Firefox…

Another example – on the home page: http://www.interxmedia.co.uk/tanshirepark/ I have a Testimonials slider and am using Alt1 background. As this by default has loads of padding, I have added a class called ‘testy’ to the slider, and added custom CSS to the Theme General Options as follows:
.testy {
padding-top: 20px !important;
padding-bottom: 0px !important;
}
… this works in Chrome and Safari as stated above but does not work in firefox or IE.

I also have the same problem when I modify style CSS on existing classes. For instance I am using the Nextgen Gallery plugin to display a gallery http://www.interxmedia.co.uk/tanshirepark/gallery/
I have added some CSS:
.ngg-gallery-thumbnail {
width:105px !important;
}
…to fix the width of the image frames so that the description text wraps, which it does nicely on the two of the four browsers mentioned and fails on the other two…

It seems as though something in Flexform’s CSS is overriding my additions/modifications in some browsers. How can I get my CSS additions to work consistently?

Other problems…

Testimonials slider:
2. Is it possible to change the speed of the slider? at the moment it is going too fast…
3. Whatever value I give ‘number of items’, the number of testimonials displayed on the slider defaults to 6…

Contact Form
4. I have added a contact form http://www.interxmedia.co.uk/tanshirepark/contact/ and there is a spurious hairpin bracket (‘>’) being added at the top. This does not exist in the html, which starts like this:
<h4>Contact Us</h4>
<table width=”90%” border=”0″ cellspacing=”0″ cellpadding=”0″>
<tr>
…
so I am completely puzzled by it…

Revolution Slider
5. I am showing some black and white images in a Revolution slider http://www.interxmedia.co.uk/tanshirepark/the-park-overview/oak/floorplans/ , and the default positioning of the fwd & back buttons (verically centered) makes them hard to see on the image background. However, no matter what changes I make to the Slider arrow vertical align settings, they remain in the same position.

General
6. I have added a new style to the CSS in Theme/General Options and I would like it to appear in the TinyMCE Styles menu so users can apply it.
Do you have any suggestions as to how this can be achieved?
I tried installing TinyMCE Advanced Plugin, but this seems to be incompatible with Flexform, since it broke TinyMCE completely…

Many Thanks for any attention you can give to these issues…
Cheers

[thewoosh]

BTW you can see an example of the first instance of problem 1 here:
http://www.interxmedia.co.uk/tanshirepark/terms/
… this text has been styled as impact_text. The custom css is being applied in Chrome and Safari but not in IE or Firefox…

[Cosmin – SUPPORT]

Hi,

I see none of the custom CSS is being applied in Firefox, can you turn off plugins and test like that?

Also, are you using any form of caching for your website?

TinyMCE – maybe this and this will help.

Regards,
————————————————————————————————————

Cosmin – Support

[thewoosh]

Hi Cosmin – thanks so much for responding.
I have a vanilla Apache 2 and vanilla wordpress 3.5 installed – I haven’t implemented any caching, so as far as I know there is no server-side caching active. The CSS problem between browsers has been persistent over the last week or so since implementing custom CSS, so I don’t think it is a caching issue. It occurs both on custom CSS entered in theme general options and with a child site with custom style.css.

As you may have noticed I have removed much of the test data from the site as it is soon to go live, but you can see the effect more clearly on the child site example:
http://www.interxmedia.co.uk/tanshirepark_bak/test-2/
…this shows the difference between the way the moz-kit browsers display my custom style.css on ‘Impact Text’ and the others don’t…

In the meantime I have fixed problem 4 above and come to grips with 5
Thanks for the links on tinymce will check them out…
Cheers,
Andy

[thewoosh]

Hi,
In order to eliminate any variables, I created a new installation of WordPress (set up as multisite) on my PC, and installed flexform and imported the site and settings.
I de-activated all plugins and created a page that used the ‘impact-text’ style, for which I included the following CSS in the custom CSS section:
.impact-text {
font-size:14-x !important;
}
I attach a side-by-side comparison of firefox and chrome rendering this page. As you can see, Chrome renders the custom CSS, but firefox ignores it.

I hope you can address this problem.
Many Thanks
Andy

[thewoosh]

OK
I would like to apologise for doubting your amazing theme…

I tracked the CSS problem down to some malformed CSS that I had entered in the custom CSS box – a lesson to me to always check my syntax first – a missing quote mark was causing (the more tolerant) mozkit browsers to simply ignore that clause, while firefox and IE were just throwing out all subsequent declarations.

I will raise the remaining items (Testimonials slider) in a seperate thread.
Thanks for your patience