Reply To: rtl styles not exist
Hello,
Example: https://www.okler.net/previews/porto/12.1.0/feature-layout-rtl.html
To activate the RTL mode please follow the steps:
1) Add the “dir” attribute in the HTML tag:
2) Copy all the files from the folder: HTML/master/rtl/css to the default css folder HTML/css.
3) Add the “rtl-” prefix in the files:
<html dit="rtl">
<head>
<!-- Basic -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Porto - Responsive HTML5 Template</title>
<meta name="keywords" content="HTML5 Template" />
<meta name="description" content="Porto - Responsive HTML5 Template">
<meta name="author" content="okler.net">
<!-- Favicon -->
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" href="img/apple-touch-icon.png">
<!-- Mobile Metas -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Web Fonts -->
<link href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800%7CShadows+Into+Light" rel="stylesheet" type="text/css">
<!-- Vendor CSS -->
<link rel="stylesheet" href="vendor/bootstrap/bootstrap.css">
<link rel="stylesheet" href="vendor/bootstrap/bootstrap-rtl.css">
<link rel="stylesheet" href="vendor/fontawesome/css/font-awesome.css">
<link rel="stylesheet" href="vendor/owlcarousel/owl.carousel.min.css" media="screen">
<link rel="stylesheet" href="vendor/owlcarousel/owl.theme.default.min.css" media="screen">
<link rel="stylesheet" href="vendor/magnific-popup/magnific-popup.css" media="screen">
<!-- Theme CSS -->
<link rel="stylesheet" href="css/rtl-theme.css">
<link rel="stylesheet" href="css/rtl-theme-elements.css">
<link rel="stylesheet" href="css/rtl-theme-blog.css">
<link rel="stylesheet" href="css/rtl-theme-shop.css">
<!-- Skin CSS -->
<link rel="stylesheet" href="css/skins/default.css">
<!-- Theme Custom CSS -->
<link rel="stylesheet" href="css/custom.css">
<!-- Head Libs -->
<script src="vendor/modernizr/modernizr.js"></script>
</head>