I am facing an issue with right to left alignment in my portlet. It displays correctly when tested on a regular HTML page, but switches to left to right alignment when integrated into a Liferay portlet. Below is the code snippet causing this problem:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
.patientInfo
{
direction:rtl;
border:2px solid;
width: 100%;
}
.titile
{
font-weight:bold;
padding-right:5px;
}
p
{
display:inline;
}
.patientName
{
background-color:#0CF;
direction:rtl;
}
.doctorName
{
background-color:#0CF;
direction:rtl;
}
</style>
</head>
<body>
<div class="patientInfo">
<div class="patientName"><p class="titile">نام بیمار:</p><p> اکبر اسدی</p></div>
<div class="doctorName"><p class="titile">نام دکتر:</p><p>مریم اخیانی</p></div>
</div>
</body>
Could you please assist in identifying and resolving the issue?