Hi! I’ve been looking through the forums & found similar issues, but nothing has worked vis a vis solving it.
What I want: a slider flush against the top bar with the logo/nav (using ShiftNav per earlier recommendation).
When I get: top bar, white space, slider.
Unfortunately, the css isn’t clear – the only thing in the editor is the warning re changing the CSS.
I’ve had the blank space issue on multiple variants with Beaver Builder, whether the BB theme or plugin. I’d give the links, but I prefer that to be private and the option doesn’t appear to be available on the initial post. Thanks!
You seem to be using ShiftNav for your header? Not really sure how that works. Anyhow, on the first site, you seem to have a blank first row which is adding the white space. Can you remove that and see if it helps?
On the other site, the rows and modules still have the default 20px margin and padding. If you remove these, the slider should flush up to the page title.
Unfortunately, like Ben, I have no experience with ShiftNav. I have recommended it to a user in the past, but this was based on their need for slid-in mobile menu.
Not really sure what you mean by the “the standard CSS for getting rid of margin/padding in WordPress”. All theme’s are different and use different classes. Therefore, there is no standard CSS to remove margin/padding?
I can’t speak for Ben, but I use Chrome dev tool’s to debug users issue related to CSS and when fixing CSS issues. If you’re not able to override the CSS via chrome dev tools, the likely cause is that you’re not being unique enough with the class(es).
For example:
To guarantee your override CSS works without issue, you can either prefix your CSS with either the node ID for the row/module or add your own class. The CSS would look something like this:
You won’t want to or need to view those files. All the CSS you need to know can be seen in Chrome dev tools or similar browser/extension. The Bootstrap file is minified for performance if you want to know more about the CSS for Bootstrap. I would recommend viewing their documentation, it is rather extensive.
The only gap between rows is through margins which by default is 20px. You can replace these values using the Advanced tab for both the row and modules. There is no need to use custom CSS for adding/removing margin/padding on rows/modules.
If you provide an example of the CSS you’re using that isn’t working and what it is supposed to be doing. We may be able to point in you the right direction.
