Responsee version lightweight responsive css frameworkWhat's New in Version 7

Responsive timeline

Responsive timeline

Thanks to the timeline, you can show an events in the handy form. Each event can be presented using an icon or an image.
read more >

New free template Financer

New free template Financer

Completely new template named Financer comes with new edition of Responsee. You can look forward to excellent design and as usually completely free! We also upgraded all the other templates for Responsee 7.
read more >

Accordion

Accordion

Thanks to the accordion, you can display a huge contents even in a limited amount of space. Responsee Accordion supports an unlimited number of nested accordions. Thanks to this, you can divide a content into more and more smaller parts.
read more >

Responsive Modals

Responsive Modals

Thanks to Modals you can display a content in simple lightbox effect over particular page content. Modals may contain common text, headlines, images, buttons, iframes and a content of modal can be divided into the columns.
read more >

Ability to display the mobile navigation on the right

Ability to display the mobile navigation on the right

Thanks to the class "mobile-nav-right" you can show the mobile navigation on the right.
read more >

lorem ipsum generator professional logo generator

Sliding Navigation Panel

Thanks to the sliding navigation panel, you can place the web site menu outside of the browser screen. This solution is fancy and very effective. The sliding navigation panel slide out from the right to left or left to right side of browser screen. When you click the toggle icon, the main content is pushes to the left or right. The default position of the sliding navigation panel is on the right side of the browser screen.

Practical utilization of the sliding navigation panel you can find in templates
Designery and Fullwidth Plus

The correct structure of a website with the sliding navigation panel:

<!DOCTYPE html>
<html>
   <head>
      ...
   </head>

   <body class="size-1280">
      <!-- Sliding nav panel -->
      <nav class="slide-nav aside-nav">
        <ul>
           ...
        <ul>
      </nav>
      <!-- End of Sliding nav panel -->
      
      <!-- Content -->     
      <section class="slide-content">  
        <header>
          ...
        </header>
        
        <section class="text-center">
           ...
        </section>

        <footer>
           ...
        </footer>
      </section>
      <!-- End of Content -->
   </body>
</html>
sliding-nav

Move the sliding navigation panel to the left

If you want to move the sliding navigation panel to the left side of the screen, add the class “slide-to-left” to the “body” element:

<!DOCTYPE html>
<html>
   <head>
      ...
   </head>

   <body class="size-1280 slide-to-left">
      <!-- Sliding nav panel -->
      <nav class="slide-nav aside-nav">
        <ul>
           ...
        <ul>
      </nav>
      <!-- End of Sliding nav panel -->
      
      <!-- Content -->     
      <section class="slide-content">  
        <header>
          ...
        </header>
        
        <section class="text-center">
           ...
        </section>

        <footer>
           ...
        </footer>
      </section>
      <!-- End of Content -->
   </body>
</html>
sliding-nav-left
Download Free Website Templates
Responsee Showcase

Add your website built on Responsee framework to our showcase