We are building a simple app containing a header, a subheader and a footer. We’ve added an ion-content area which only contains a WYSIWYG editor (Redactor). This editor has an toolbar to format text etc.
A) First I tried to fix the position of the toolbar on top of the content area. But while scrolling the toolbar moves too.
B) So I tried to place the toolbar (using a div and a redactor option called externalToolbar) outside the content area (between sub-header and ion-content). To display the toolbar at correct location I’ve added this to my css:
position: absolute !important; and top: 88px;
Now the toolbar stays at correct position. But the toolbar overlaps the content area so the first two rows of my text in my editor aren’t shown.
C) Next I tried to add this toolbar to sub-header or footer. But it seems this is not possible because only images, text and buttons are allowed in footer, etc.
Any help is welcome to show the toolbar at a fixed position to enable a user to format his text.