none
CSS : Two Language RRS feed

  • Question

  • I've an html file which contains Arabic and English. I want that Arabic texts be displayed by 14 pt font size and English texts by 12 pt.

    Saturday, March 8, 2014 3:26 PM

Answers

  • I already told you that there are significant semantic advantages to you of adding a "lang" attribute to your Arabic language elements, which will improve your search engine visibility. It would also automatically add the hook that CSS needs to be able to automatically detect those areas, so you can style them. You may choose to ignore our advice if you wish, but please do not expect us to continually provide the same answers.

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.

    • Marked as answer by amir bahr Tuesday, March 11, 2014 7:49 AM
    Monday, March 10, 2014 7:29 PM

All replies

  • First, don't use pt. That does not behave consistently in browsers. (It's really for print.)  Use ems or % so that text can be resized when people change browser settings.

    As for different sizes for different languages, if you are asking if there is a way to do that automatically based on the language, no, there is not.  You will need to style them separately yourself.

    Saturday, March 8, 2014 4:58 PM
  • Actually, if you are designating your foreign language sections with a language attribute (which will also help you search engine relevance for searchers specifying Arabic), you can actually target those sections of text using attribute selectors.

    So, let's say you have this:

    <p lang=ar>الآن هو الوقت المناسب لجميع الرجال جيدة أن يأتي إلى المعونة من حزبهم.</p>

    and you want to target it, the CSS selector for that would be this:

    p[lang="ar"] {
       color:red;
       font-size:1.2em;
    }

    That selector would set all of your Arabic text to red, 1.2em size. If you are not currently using the lang attribute for your Arabic text, you should start, since that increases the semantic richness of your content, and will make your pages appear higher in search results specifying Arabic. And, as you can see, it makes it easy to target with CSS.  ;-)

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.

    Saturday, March 8, 2014 11:19 PM
  • Scott,

    That is styling the language yourself, as I said.   :)

    Sunday, March 9, 2014 1:49 AM
  • Hi

    Is there any setting in CSS for detecting different language automatically?

    Monday, March 10, 2014 10:54 AM
  • As I already said in my first response: no.  You have to set up your markup and styling to do that.
    Monday, March 10, 2014 4:19 PM
  • I already told you that there are significant semantic advantages to you of adding a "lang" attribute to your Arabic language elements, which will improve your search engine visibility. It would also automatically add the hook that CSS needs to be able to automatically detect those areas, so you can style them. You may choose to ignore our advice if you wish, but please do not expect us to continually provide the same answers.

    cheers,
    scott


    Please remember to "Mark as Answer" the responses that resolved your issue. It is common courtesy to recognize those who have helped you, and it also makes it easier for visitors to find the resolution later.

    • Marked as answer by amir bahr Tuesday, March 11, 2014 7:49 AM
    Monday, March 10, 2014 7:29 PM