مشکل با منو و طراحی

[mani2000]

سلام
من یه سایت میخوام طراحی کنم
دوتا مشکل دارم که خواهش می کنم اساتید کمک کنند
یی اینکه من از بوت استرپ برا منو استفاده کردم میدونم چکار کنم که وقتی سایت رو روی گوشی باز می کنم منو باز شده نباشه یعنی منو بسته باشه توی عکس ببینید
میخوام کاربر روی ایکن سه خطی خودش کلیک کنه منو باز شه نه اینکه خودش باز باشه و اینکه میخوام منو در اسکرول بالا بچسبه
142101
این کد منو


<nav class="navbar navbar-inverse ">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".js-navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">اخبار مدرسه</a>
</div>

<div class="collapse navbar-collapse js-navbar-collapse">
<ul class="nav navbar-nav">







<ul class="nav navbar-nav navbar-right">



<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">ارتباط با ما <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">ارتاط با مدریت</a></li>

<li><a href="#">ارتباط با دبیران</a></li>
<li class="divider"></li>

</ul>
</li>

</ul>

</ul>

<form class="navbar-form navbar-left" role="search">
<div style="direction:rtl;align:center" class="form-group">
<input style="height:30px;width:120px" type="text" class="form-control" placeholder="Search">
</div>
<button type="submit" class="btn btn-default"><span class="glyphicon glyphicon-search"></span></button>
</form>





<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">پیوندها <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">پژوهشکده معلم</a></li>

<li><a href="#">اتوماسیون اداری</a></li>

<li><a href="#">ادرا کل آموزش و پرورش</a></li>
<li class="divider"></li>
<li><a href="#">سازمان سنجش</a></li>
</ul>
</li>

</ul>





<ul class="nav navbar-nav navbar-right">
<li><a data-toggle="modal" href="#myModal">ورود</a> </li>
</ul>


<ul class="nav navbar-nav navbar-right">
<li><a data-toggle="modal" href="#myModal2">ثبت نام</a> </li>
</ul>


<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">درباره ما <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">معرفی کادر آموزشی</a></li>

<li><a href="#">درباره مدرسه</a></li>
<li class="divider"></li>


</ul>
</li>

</ul>
</div>

</nav>



و یه تب میخوام ایجاد کنم این کدهاشه

<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li style="background-color:gold;direction=rtl" role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
<li style="background-color:gold;direction=rtl" role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
<li style="background-color:gold;direction=rtl" role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
<li style="background-color:gold;direction=rtl" role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>


<!-- Tab panes -->
<div style="direction=rtl" class="tab-content">
<div style="background:#671902;color:yellow;height:150px" role="tabpanel" class="tab-pane active" id="home">hfhdutiutihghghghghg
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq44444444444444444444hhhhhhhhhhhhhhhhhhhh</p>
</div>
<div style="background:#671902;color:yellow;height:150px" role="tabpanel" class="tab-pane" id="profile">ghghghghghg
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
</div>
<div style="background:#671902;color:yellow;height:150px" role="tabpanel" class="tab-pane fade " id="messages">fgfgfgfgf
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq7777777777777777dddddddddddddddddddddddddddddddd d</p>
</div>
<div style="background:#671902;color:yellow;height:150px" role="tabpanel" class="tab-pane" id="settings">kjkjkjkj
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
<p>kjhkjhkjhkjhjgfdfsdffdhjgjhlkhjgfgfgdfsdsduiytytre wq</p>
</div>
</div>
میخوام وقتی سایت رو گوشی باز شد بدنه تب اسکرول بخوره و اینجوری نوشته هاش نزنه بیرون از هر دو طرف
ممنون میشم کمک کنید خیلی لازم دارم
142100
و اینکه
اصلا چکار کنم متن توی پنل ها در گوشی اسکرول بخوره
این کد پنل

<div class="panel panel-info bodypanel1">
<div style="background-color: red" class="panel-heading headerpanel">
news
</div>
<div class="panel-body">
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhkkgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>
<p>hgfghfhfhfhgfhg</p>

</div>
</div>
اصلا چطوری سایت مثل سایت سنجش وقتی توی گوشی باز میشه کل سایت کوچولو در گوشی باز شه و کاربر خودش زوم کنه
؟؟؟
ممنون

[پیام حیاتی]

سلامدر بخش طراحی وب فیلم های آموزشی بوت استرپ رو ببینید.مشکلات شما به خاطر این هست که بدون آموزش شروع کردید به کدنویسی.

[mani2000]

سلام
نه بدون آموزش که شروع نمی شه کرد تمام فیلم های بوت استرپ رو از آپارات دیدم
اما نميتونم مشکل اینها رو حل کنم
کسی نیست کمکم کنه؟
خیلی واجبه..

[mani2000]

کسی نیست کمکم کنه؟
:گریه::گریه:

[general67]

تو فایل های سی اس اس یه فایل مربوط میشه به لایوت بندی از اونمیتونی تغییرش بدی یا
از توی فایل های جاوا ایسکریپت که وقتی صفحه تغییر اندازه میده colapse میکنه.:متفکر:

[mani2000]

ممنون از پاسختون
نه هر چی فایل ها رو دستکاری می کنم نميشه
شما نمونه ندارید ؟ کدی که بگه چکار کنم سایت کلا کوچک بشه و متن پنل بیرون نزنه