IMANAZADI
جمعه 22 بهمن 1395, 08:58 صبح
سلام
دوستان عزیز یک مشکل اساسی دارم هر روشی امتحان میکنم جواب نمیده
یک جدول دارم شامل دو ردیف و هر ردیف دو ستون
میخوام در ردیف دوم ستون دوم یک div رو به سمت راست td منتقل کنم هر کاری میکنم خط شکسته میشه و به خط پایین منتقل میشه . نمیخوام خط شکسته بشه
اون Span status هم میره بالا میخوام تو یک سطح باشن
کدهای زیر رو گذاشتم در گوگل کروم تقریبا درست جواب میده ولی در فایرفاکس نه
ممنون میشم راهنمایی کنید
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
*{margin:0;padding:0;box-sizing:border-box;}
table
{
width:100%;
margin:0 auto;
border-collapse: collapse;
border-spacing:0;
table-layout: fixed;
white-space: nowrap;
}
th,td
{
height: 30px;
text-align: center;
text-transform: capitalize;
padding-left:5px;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.subject{ background-color:#fde4e4;border:solid #afafaf 1px; width:15%;text-align:left;}
.des{background-color:#f3f3f3; font-size:12px;font-weight:bold;border:solid #afafaf 1px;width:85%;text-align:left;}
</style>
</head>
<body><br><br>
<div style="width:900px; margin:0 auto;">
<table >
<tbody>
<tr>
<td class="subject">test</td>
<td class="des" ><span>test des</span>
</td>
</tr>
<tr>
<td class="subject">last</td>
<td class="des">
<div style="display:inline-block; border:solid 1px;">
<span style="width:160px; display:inline-block;">bbbbbbbbbb</span>
<button>click me</button>
</div>
<div style="float:right; border:1px solid red;">
<form method='post' id='frm_status' style='display:inline-block'>
<span style="display:inline-block;vertical-align:middle;">status :</span>
<div class="switch-field" >
<input type='radio' id='check' class='togglee checked' name='toggle' value='check' checked >
<label for='check'>N</label>
<input type='radio' id='reviewed' class='togglee' name='toggle'value='review'>
<label for='reviewed'>R</label>
<input type='radio' id='completed' class='togglee' name='toggle' value='comp' >
<label for='completed'>C</label>
</div>
</form>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
دوستان عزیز یک مشکل اساسی دارم هر روشی امتحان میکنم جواب نمیده
یک جدول دارم شامل دو ردیف و هر ردیف دو ستون
میخوام در ردیف دوم ستون دوم یک div رو به سمت راست td منتقل کنم هر کاری میکنم خط شکسته میشه و به خط پایین منتقل میشه . نمیخوام خط شکسته بشه
اون Span status هم میره بالا میخوام تو یک سطح باشن
کدهای زیر رو گذاشتم در گوگل کروم تقریبا درست جواب میده ولی در فایرفاکس نه
ممنون میشم راهنمایی کنید
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
*{margin:0;padding:0;box-sizing:border-box;}
table
{
width:100%;
margin:0 auto;
border-collapse: collapse;
border-spacing:0;
table-layout: fixed;
white-space: nowrap;
}
th,td
{
height: 30px;
text-align: center;
text-transform: capitalize;
padding-left:5px;
vertical-align: middle;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.subject{ background-color:#fde4e4;border:solid #afafaf 1px; width:15%;text-align:left;}
.des{background-color:#f3f3f3; font-size:12px;font-weight:bold;border:solid #afafaf 1px;width:85%;text-align:left;}
</style>
</head>
<body><br><br>
<div style="width:900px; margin:0 auto;">
<table >
<tbody>
<tr>
<td class="subject">test</td>
<td class="des" ><span>test des</span>
</td>
</tr>
<tr>
<td class="subject">last</td>
<td class="des">
<div style="display:inline-block; border:solid 1px;">
<span style="width:160px; display:inline-block;">bbbbbbbbbb</span>
<button>click me</button>
</div>
<div style="float:right; border:1px solid red;">
<form method='post' id='frm_status' style='display:inline-block'>
<span style="display:inline-block;vertical-align:middle;">status :</span>
<div class="switch-field" >
<input type='radio' id='check' class='togglee checked' name='toggle' value='check' checked >
<label for='check'>N</label>
<input type='radio' id='reviewed' class='togglee' name='toggle'value='review'>
<label for='reviewed'>R</label>
<input type='radio' id='completed' class='togglee' name='toggle' value='comp' >
<label for='completed'>C</label>
</div>
</form>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>