I am using Foundation 4.0.8, and there is a whitespace or gap between section tabs titles. It only happens when I first load the page, and it goes away when the window is resized. I found that the issue is with incorrect calculation of size of the first title tab. It adds style="left: Npx" to the second title tab, and N is larger than the size of the first title tab.
Has anyone noticed this? How can I go about mitigating this issue?
Thanks in advance!
Related
New to Xaringan and StackOverflow. Had a hard time figuring out how to create tabs (panels) on slides given the info available in the instructions. But, I have it working. However, there is a ] below the title on every Panel slide. Why? This seems to be causing my text to go off the bottom of the slide. I think if I could remove it, then the slides would shift upwards and there would be enough space for my content to fit on the slide.
I have tried removing various ] brackets, but depending on which one I remove, it either removes panels and overlaps all of the content on one slide with the tables and graphs or it deletes the panel and all the content from the panel.
At first, I was unable to make more than one slides with panels. The first slide worked perfectly fine and did not have the random ] at the top of it. But the second slide would not create panels. It just threw all of the content overlapping on one slide. I was able to create two slides with panels when I found
div solution
here
, but that is when the issue with the ] started appearing. The ] is not part of the content.
In reality, there are 4 tabs per slide in roughly the following format:
Tab 1: content and image
Tab 2: R code reactable table
Tab 3: conent and imate
Tab 4: R code ggplot2 plotly interactive graph
I expect one slide with 4 tabs that can be clicked on, but without the extra space or extra characters between the title and the tabs.
EDIT
I put my code here, but someone changed it and it no longer reflected what I had written. I deleted it because it was no longer my code. I also found something in the source code. There is clearly a ] in the source code. How do I find that file and remove it from the source code?
I have this page with a permanent sidebar. Along the top of the page there is a group of MUI tabs.
The Estimations tab contains a Material-Table. Navigating to this tab causes the page to expand horizontally. I want to stop this from happening.
Setting a fixed width to the table only stops the table from expanding. The background still expands when navigating to this tab. Setting a fixed width for the Paper component in IntakeDetails2 does not stop this expansion from occurring.
This code sandbox link shows a working demo of this issue. I would like to keep the estimation tab along with its table within the same boundary as the solutioning tab. The outcome here would be a horizontal scroll bar on the table itself rather than the web page.
I am attempting to edit the header of my shiny application to include 3 items.
The title (on left)
The sidebar menu (burger menu) next to title
A company logo (on right)
I have followed some other posts and attempted to replicate their methods:
Adding a company Logo to ShinyDashboard header
Add text on right of shinydashboard header
How to add a company Logo to ShinyDashboard header (Not mainPanel or mainHeader)
Unfortunately I cannot manage to replicate their solutions. I have managed to add the logo to the right side using the following:
header = dashboardHeader(title = div(dashboard_title, style="text-align: left;"))
header$children[[3]]$children <- tags$img(src=logo_path, align="right", height='50px')
But this removes the burger menu, which I need to retain. I could add the logo instead of the title (as described in one of the links above), but I need to have both items.
I am fairly new to css etc, and so it is entirely possible that the answer is in one of the above links but I was unable to modify it correctly.
Any and all help is appreciated. Thank you.
After trying a fair few things and not getting anywhere I realised that the fix is actually very simple:
header$children[[3]]$children[[3]] <- div(tags$img(src=logo_path, align="right", height='50px'))
There are 3 children of the third children in header. The piece of code in the question was replacing all three with the logo. However, the solution only replaces the last bit of the header with the logo, retaining the burger menu.
I'm having trouble thinking through a proper grid layout for part of a landing page. My issue is with the arrows as shown. The blue/green boxes show the row/column layout I have currently. I have thought about putting the arrows in their own columns but then the "Step X" and summary text won't flow into the arrow columns. The important part is that the images and the text in each column properly line up, especially when switching to single-columns on mobile.
Any advice is appreciated.
When using bootstrap I'm having issues with my navbar turning into 2 rows before it collapses. How can I increase the point at which the collapse happens? The bootstrap example here shows what issue I'm dealing with: http://getbootstrap.com/examples/jumbotron/
If you decrease the size of the browser the form inputs drop to a second line before the whole navbar collapses to a button.
You'd need to go to the Bootstrap's customize section, there you'll find an option named #grid-float-breakpoint whose description reads
Point at which the navbar stops collapsing.
Set the value to #screen-md and download your custom CSS