开发者

css of drupal theme to "right to left"

I want to change the css of a theme i downloaded from drupal. The menu is left to right, but I am writing in a language which is from right to left. How do I make t开发者_运维知识库he menu items come from right to left?

the css of menu I found assuming I identified the correct place is:

/* MENU & link STYLES */

li.leaf {
    list-style-image: url(../images/all/menu-leaf.png);
}
li.expanded {
    list-style-image: url(../images/all/menu-expanded.png);
}
li.collapsed {
    list-style-image: url(../images/all/menu-collapsed.png); /* LTR */
}

#subnavlist a {
    border: 1px solid #ddd;
    color: #444 !important;
    background-color: #eee;
}
#subnavlist li a:hover {
    background-color: #dbdbdb;
}
#navlist2 a {
    color: #888 !important;
}
#navlist2 a:hover, #navlist2 a.active, 
#footer a:hover, #footer a.active {
    color: #333 !important;
}


I am not sure if this do the job you need (it's not too clear) but you can use in your css direction: rtl;

Read more: http://www.w3.org/International/tutorials/bidi-xhtml/


By default, li elements flow/read in the order they are in the markup.

ie.

<ul>
  <li>One</li> 
  <li>Two</li>
  <li>Three</li>
</ul>

produces One Two Three (in a list).

whereas li { float:right; }

produces Three Two One, although the markup will not change.

does that make sense? So to reverse the "readable" order of a list without changing the markup, you must float the li elements right.

There may be other ways.

edit: i should clarify, this works with horizontal navigation. not sure if this applies to you ~ your post states the menu is left to right


I'm a chinese,and my English is not good.But I hope you can understand this.

I think you can use the two attributes of CSS:position:relative;right: length;

length is the distance of the current object'right to its father object'right.


Drupal has built in support for RTL languages, and swapping in the appropriate CSS when a language is defined as being RTL. If you look at the core Garland theme (Drupal 6) or Bartik (Drupal 7), you'll find examples of this. For every style sheet that defines LTR styles (for example, style.css), there should be a corresponding RTL stylesheet (style-rtl.css). The theme will output these when displaying a RTL language.

For reference, look at this documentation page. The Zen theme also has very good support for RTL, and is well documented.

Since the CSS in your example above has a note about LTR, it would imply it supports RTL languages, so the changes you're looking to make should be done in the *-rtl.css stylesheets.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜