我们的网站有问题。我们使用 bootstrap css 和 tinymce 作为富文本编辑器。
使用 bootsratp 我们创建了一个导航栏。
问题是，当我们向下滚动网站时，tinymce 文本区域会显示在导航栏上。我们试图用 z-index 解决这个问题，但这并没有解决任何问题。
你们有什么建议或解决方案吗？
提前致谢
编辑：
<!DOCTYPE html>
<html>
<head>
<title>Serviceportal 3</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<script type="text/javascript" src="/public/vendor/jquery/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/public/vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/public/vendor/bootstrap/js/bootstrap-inputmask.js"></script>
<script type="text/javascript" src="/public/js/sp_global_calsses.js"></script>
<script type="text/javascript" src="/public/js/sp_global_functions.js"></script>
<script type="text/javascript" src="/public/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="/public/js/bootstrap.file-input.js"></script>
<script type="text/javascript" src="/public/vendor/tinymce/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript" src="/public/vendor/tinymce/js/tinymce/jquery.tinymce.min.js"></script>
<link rel="stylesheet" type="text/css" href="/public/vendor/bootstrap/css/bootstrap-responsive.min.css" />
<link rel="stylesheet" type="text/css" href="/public/vendor/bootstrap/css/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="/public/css/bootstrap_css_reset.css" />
<link rel="stylesheet" type="text/css" href="/public/css/style.css" />
<link rel="stylesheet" type="text/css" href="/public/css/datepicker.css" />
<link rel="stylesheet" type="text/css" href="/public/css/tiny_mce_reset.css" />
</head>
<body>
<div class="container" id="navi" style="width: 100%">
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<!-- .btn-navbar is used as the toggle for collapsed navbar content -->
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<!-- Be sure to leave the brand out there if you want it shown -->
<div class="nav-collapse collapse">
<a class="brand" href="/app_dev.php/start">
<img src="/public/images/sp_logo.png" alt="SP" />
</a>
<ul class="nav">
<li class="dropdown">
<a data-toggle="dropdown" class="dropdown-toggle" href="#">
Options <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li>
<a href="/app_dev.php/global/user_settings/show">
<img src="/public/images/icons/icon_user.png" alt="" />
User settings
</a>
</li>
<li>
<a href="/app_dev.php/global/downloads/show">
<img src="/public/images/icons/icon_download.png" alt="" />
Downloads
</a>
</li>
<li>
<a href="#">
<img src="/public/images/icons/icon_table.png" alt="" />
Registrations
</a>
</li>
<li>
<a href="#">
<img src="/public/images/icons/icon_speech_bubble.png" alt="" />
Contact / Feedback
</a>
</li>
<li>
<a href="#">
<img src="/public/images/icons/icon_info.png" alt="" />
Information
</a>
</li>
</ul>
</li>
</ul>
<ul class="nav pull-right navbar_pull_complete_right">
<li class="center_navbar_plain_text">
<span style="margin-top:30px; font-size:14px;" id="date_time"></span>
<script type="text/javascript">window.onload = date_time('date_time');</script>
</li>
<li>
<a href="/app_dev.php/login/logout">
<button class="btn btn-danger" type="button"><i class="icon-off icon-white"></i></button>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div style="height:35px;"></div>
<div id="sp_content">
<!-- Content Container -->
<form class="form-horizontal" id="form_user_settings" action="/app_dev.php/global/downloads/save_uploads" method="POST" enctype="multipart/form-data" >
<!-- Container with buttons -->
<div class="well well-small">
<button class="btn" type="submit">
<img src="/public/images/buttons/save.png" alt="" /><br />
Save
</button>
</div>
<div class="row-fluid" style="">
<div class="span9 well well-small">
<div class="well_header small">
Download Details
</div>
<div class="well_content">
<div class="control-group">
<label class="control-label sp_loginpage_label" for="name">Name</label>
<div class="controls">
<input type="text" class="input-xlarge" id="name" name="name" required value="versuch">
</div>
</div>
<div class="control-group">
<label class="control-label sp_loginpage_label" for="version">Version</label>
<div class="controls">
<input type="text" class="input-xlarge" id="version" name="version" required value="versuch">
</div>
</div>
<div class="control-group">
<label class="control-label sp_loginpage_label" for="description">Description</label>
<div class="controls">
<textarea class="richtext_editor" required name="description" id="description">versich</textarea>
</div>
</div>
<div class="control-group">
<label class="control-label sp_loginpage_label" for="version_history">Version History</label>
<div class="controls">
<textarea class="richtext_editor" required name="version_history" id="version_history">asdasfc</textarea>
</div>
</div>
<div class="control-group">
<label class="control-label sp_loginpage_label" for="download_counter">DownloadCounter</label>
<div class="controls">
<input type="text" class="input-xlarge" id="download_counter" name="download_counter" readonly value="5">
</div>
</div>
</div>
</div>
</div>
</form>
</div>
<!-- Container for Document Ready functions -->
<script type="text/javascript">
$(document).ready(function() {
// ### Initialisation from TinyMCE Richtexteditor ### //
tinymce.init({
mode: "specific_textareas",
editor_selector: "richtext_editor",
theme: "modern",
width: 360,
height: 200,
resize: false,
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l ink image | print preview media fullpage | forecolor backcolor emoticons",
style_formats: [
{title: 'Bold text', inline: 'b'},
{title: 'Red text', inline: 'span', styles: {color: '#ff0000'}},
{title: 'Red header', block: 'h1', styles: {color: '#ff0000'}},
{title: 'Example 1', inline: 'span', classes: 'example1'},
{title: 'Example 2', inline: 'span', classes: 'example2'},
{title: 'Table styles'},
{title: 'Table row 1', selector: 'tr', classes: 'tablerow1'}
]
});
});
</script>
</body>
</html>