Quantcast
Channel: phpBB.com
Viewing all articles
Browse latest Browse all 2874

[3.3.x] Styles Support & Discussion • Highlighting Search Box Modifies Site Text Slightly - CSS Assistance?

$
0
0
Good day.

I have been battling an issue to do with styling for a handful of hours now, and I am starting to suspect that it could be beyond my skill to solve. I would like to please ask if anyone has a solution, or knows what could be causing this, in order to prevent myself from endlessly battling with something which could have an obvious or really complex solution.

I have a forum which is using the latest (3.3.11) version of phpBB. It uses a heavily modified Pycode style which uses Prosilver as a base. I have limited (rusty) web development skills and a bit of experience in setting up and battling with phpBB.

My problem is the following:

When highlighting the search box, i.e. when clicking in it, various text throughout the body of the site changes ever-so-slightly. If one clicks away from the box, it restores itself to how it should look.

Here is an example with the Pycode theme without having clicked in the search box:
PycodeNoSearch.PNG
Here it is with having clicked in the search box:
PycodeWithSearch.PNG
This one is tricky to spot, but here's how it looks with Prosilver normally:
ProsilverWithSearch.PNG
Here is how Prosilver looks when having highlighted the search box:
ProsilverNoSearch.PNG
It's a strange effect that is difficult for me to pinpoint exactly - it is not only a sort of loss of bold formatting, but it's almost a general increase in "blurriness" ever-so-slightly.

I have taken the following steps to try to address this:
  • Reverted to Prosilver - the effect is subtle, but it's still present.
  • Selectively disabled .css files to try and isolate it - no luck, in fact it seems present even if I basically disable all .css
  • Copious amounts of searching online.
  • Confirmed that it's present on other devices and alternative web browsers.
  • Confirmed that it's absent when viewing the site on a phone.
  • Using the inspector to selectively disable just about everything until something gives way. This had selective results, which I will demonstrate below.
In going through the inspector, I did find that disabling the float parameter found here solved the problem:
InspectParameter.PNG
The issue with that is that it introduces additional complexity in the form of the 'sequence' of the search box, magnifying glass icon and gear icon being incorrect. That I could live with and treat as its own issue, but the reason that this is not satisfactory is that while this solves the issue for the search box at the top right of the page, the search which is present when viewing topics is not solved by this, and no amount of troubleshooting on my end seems to address it.

Here is an example from the VLC forums (as an example) of the search box that I've made no headway with whatsoever. This one doesn't seem present on phpBB's forum:
VLCExample.PNG
It's entirely possible that this is my own stupid fault. I've modified the theme quite a bit historically and this problem's gone unnoticed by me for years, but now it's bothering me. Could someone please offer some insight into why my search boxes might be "distorting" text when I attempt to use them? Could something on the PHP side even possibly be doing this? Happy to provide further updates from additional troubleshooting.

Thanks for your time.

Statistics: Posted by Silent Supporter — Tue Jan 30, 2024 9:21 pm



Viewing all articles
Browse latest Browse all 2874

Trending Articles