EasyUI Forum
March 28, 2024, 03:13:04 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: How to achieve responsive header  (Read 8671 times)
JPi
Newbie
*
Posts: 18


View Profile Email
« on: December 08, 2016, 12:37:21 AM »

Hi,

I have a issue during browser window resizing and during screen magnification. The html page compromises header area followed by easyui controls like tabs. The issue during resizing of browser or magnifying the screen is that the easyui controls are acting responsively but not the header. How to overcome the issue ? The tabs are overflowing into the header area.

Thanks,
JPi
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 on: December 08, 2016, 02:22:25 AM »

The tabs can only display in one line with nowrap. You can click the 'left' and 'right' navigating buttons to scroll to the special tab. You also can call the extended method 'navmenu' to display a drop-down menu that allows you to select all the tabs.

http://www.jeasyui.com/forum/index.php?topic=6191.0
Logged
JPi
Newbie
*
Posts: 18


View Profile Email
« Reply #2 on: December 08, 2016, 03:23:49 AM »

Hi stworthy,

I do get the right and left arrows to navigate the tab. What I meant is the header area (containing img - logo, logout button and a easyui - search box) gets overshadowed by tab row. Within tabs all get self aligned with respect to screen size. No issue there.

What CSS should I apply so that the header div tag also becomes responsive ?

Thanks,
JPi
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 on: December 08, 2016, 08:59:09 AM »

Please show an example to describe your requirements.
Logged
JPi
Newbie
*
Posts: 18


View Profile Email
« Reply #4 on: December 29, 2016, 04:36:20 AM »

Hi stworthy,

Please refer to the attached file and help with issues highlighted in blue and red.

Thanks,
JPi
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!