I am using a WordPress theme and i have installed the Google translate plugin.
I'm having an issue after I translate the language. The font size is entirely to large after the change from English to any language. I have researched and found that I could use :lang pseudo tag, however when i inspect with firebug the html class of my page is still "en-US" so would the :lang pseudo tag work?
If so how do i know what to call when i switch it to french? I have been researching this for hours and have yet to find a solution. Here is a link to the website, any help would be greatly appreciated
http://rightbrainmediaanddesign.com/wordpress_jinja/
///update 1:09am ET///
I found that after translation it was wrapping my text in <font> tags so if i call that in the css it allows me to change it universally for any translation, however I still cannot target a specific language. Here is what i did. #primary-menu font {
font-size: 11px !important;
} Now that did the trick, but as i said it is universal for any translation i.e. from english to any language. Now the challange is to be able to change just french or just spanish.
(Answered in a question edit. Converted to a community wiki answer. See What is the appropriate action when the answer to a question is added to the question itself? )
The OP wrote:
Okay, ISSUE SOLVED!! I downloaded a different wordpress plugin here it is.
http://transposh.org/
Now this plugin ties into the Google Translate API, however unlike the google plugin this one actually changes the lang="" in the <html> section above the header. So, in your css, to reference a specific language in the css it would look like this(for those that dont know) html:lang(es) That would be for spanish, to reference a specific div it would look like html:lang(es) #primary-menu {}. To locate your language abbreviation, just inspect your document and you will see it located at the very top of the html in this case it says lang="es". I sure hope this helps someone out there, because it just did wonders for me.
Related
We're using Barlow, available for free from Google fonts, in a web app. Here's the way a sample phrase looks when rendered on Google's example page. (If you want to reproduce it, you will need to enter the custom text yourself and adjust the slider to 14px.)
Note, in particular, the distinct space between the bottom of the i and its dot above, as well as the clarity of the top part of the f.
This is how the same phrase looks when rendered in our app, as reproduced in this Code Pen.
Note the muddy space between the i and its dot, as well as the muddy top curve to the f.
I've tried looking through all the styles on the elements in question, and I can't find any style that should affect these differently. The network tab clearly shows that the bold version of the font is being loaded; it doesn't look as if this could be faux bold.
This may seem trivial, but we've actually had quite a few complaints about how the font looks in our app, specifically that the bold, lowercase i looks like an l.
Anyone have an idea what might be happening here?
Update: Using Chrome on a Mac; I can confirm the same issue in Firefox. This is on an external display... on a retina there's no problem, as there is way more detail.
The problem turned out to be a problem with the source repo: "hinting got missed in the most recent commit" and the Google specimen (which looked correct) was "actually running an earlier version."
Happily, the maintainer was able to get the problem fixed with a subsequent version.
I am using weebly site builder and so just a beginner on Html coding. I am having issues making anchors work on my pages. They seem to work on some systems and not others, and so I think there must be a better method.
Here is what I am doing
I have a guest author page and I want each guest, to have a direct link to his section of the web page
I set up an anchor as follows
Then use the following link to it
http://arthurvaso.weebly.com/guests2016.html/#smith2
On some computers/broswers this works just fine, in others, it just goes to the Top of the page instead of the section I want.
I basically have pages I want to make direct links to
Poet1
Poet2
Poet3 etc
I search here, an all the posts were either years old, or not exactly the answer I was looking for. It seems the newer the browser version, the less my method works.
I really appreciate any help, thanks!
There is a little trick to it, but it's an easy fix for you. You are missing in your Anchor.
Change:
<a id="smith2"></a>
To:
<a id="smith2"> </a>
Make sure to publish the changes.
And, note that your Anchor Link should be:
http://arthurvaso.weebly.com/guests2016.html#smith2
without the / after .html
Would anyone happen to know how to use CSS to link to an internal page instead of using a href?
The situation is... I have a feed on a page from an external source on another one of my website (which controls the link) I wish to use CSS at my end to change the direction of the link almost creating a feed without coding RSS.
As of now I am using the following code to kill the link as I would rather it go nowhere than to an undesired place:
.col-one-thirdtest a.item-link {
pointer-events: none;
cursor: default;
}
Any help would be greatly appreciated.
Problem solved by using http://open.dapper.net/user-dapps.php and http://feed.informer.com/ in order to select the sections of the page I needed and then convert them into an RSS feed! Job Done!
Nope. CSS is not a scripting/behvaioral language. It's a styling language. (Your pointer-events trick doesn't work on all browsers, anyway.)
You'll need to use JavaScript to change the link locations.
Also (as a side note), you might want to reconsider your reasons for having the feed from said external source if the links don't go where you want them to. The behavior you're asking for suggests that your feed might be the wrong way to go about your desired effect.
Is it possible to change CSS that google Chrome apply to websites.
I want to hide some elements for example on facebook to dont see it, becouse it eats half of my free time.
Something like
.facebook-wall{display:none;} -auto applied everytime I go to fb.
Assuming I understand you correctly...
This isn't for a website you're making
This is only for your own personal use
Use Tampermonkey.
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo?hl=en
It's supposed to work much like Greasemonkey (the Firefox add-on), and it should meet your needs.
Stylebot is a good extension. You can interactively build some custom CSS to apply to your choice of website.
It even seems to have an accompanying website where other people have shared their concoctions, so possibly somebody has already put together something to filter down Facebook feeds.
I came up with a strange problem. I am building this site: www.bellated.us.lt and after using search (let's say - http://www.bellated.us.lt/?s=nonews) all the custom typography (like font-faces and google webkits) disappear. This is only in firefox. Actually no idea where to start to look for the problem. Any ideas on this issue will be appreciated.
Regards,
Probably it is because of invalid HTML. You have two opening tag and no closing .
First correct the tags then check if it is still showing incorrectly in firefox.