What is causing this nav bar to look different? - css

I am working on a Drupal 6 site that some CSS issues. I have used firebug to try and determine what is causing it, but I am at a loss.
Messed up nav bar
Correct nav bar
The page has a custom app that is loaded when you click on the link. I corrected another problem in the custom app stylesheet a couple of weeks ago by using firebug. I have tried modifying the dimensions in the theme stylesheet and the custom app stylesheet with no luck. I appreciate any suggestions.

change your #content css width to : width:657px;
And play with the margin to get it the same way
Check your sidebar too it's definitively different, maybe you wont have to modify the content if you modify the sidebar
you have two time the class #nav remove the one without the background-image
Resize the height of your class #title : #title{height: 34px;}
But one more time you have to class #title, so remove the one that as a bigger heigth thant 34px
Remove the color here : #nav a:link { text-decoration: none;}
5.You need to add this class to the link that is active : #nav a.active {background: url("/themes/a3_atlantis/active_overlay.png") repeat-x scroll 0 0 transparent;color: #0B486B;height: 24px;}
Lots of modification ;)
OR juste remove the duplicates classes and it will help a lot ! !

Related

Top Margin / Overlay and Hiding Elements

https://www.insure.report/en
I need to fix the Updates widget to have a top margin so it isn't covered by the header OR I need the widget to load on top of the header, not behind it.
Then I need to hide the 'Submit an idea' link.
I'm still new to CSS and the Submit link uses several classes so I don't know which to set to display none.
Any help or guidance is appreciated.
Without seeing your html and css it's hard to be absolutely positive but I gave the id frill in dev tools a property and value margin-top: 20px and that seems to solve your first question in dev tools. Since you are using bootstrap, in your custom CSS stylesheet you'll probably want to add:
#frill {
margin-top: 20px!important;
}
For the submit link you could give that link a class, like class="hide-link" in your html and then give that class a CSS rule of display: none; like:
.hide-link {
display: none!important;
}
I configured it according to https://help.frill.co/article/75-adding-the-widget
It's not really the right answer because what I was seeking was not done. But I removed the top elements instead.

Sub menu moves when changing padding

I have a Prestashop with a CSS menu, http://empk.dk/nyshop/ the padding is now: 15px 9px 15px in this #header .pt_custommenu .pt_menu
Before I changed it, it was 11px 9px 37px, and it worked before, but now, the sub menu doesn't align with the main menu, I've tried to look in the chrome debug mode, and in the CSS file, but I just can't find the issue or what code to edit.
I assume it's in the div called popup, but I can't find it.
You can see the CSS file here: http://empk.dk/nyshop/themes/pos_elly5/modules/posmegamenu/css/custommenu.css
The menu I want to edit is the "beige" / yellow colored.
Hope you can help!
".popup" Class having css property through the Jquery or inline style so you need to find this class and apply "top:53px" on that class
or
just write in your css this Class :
.popup{
top:52px !important;
}
but when you use the "!important" keyword at that time you need to be very careful that it affects others class or not.

How to hide line below firefox navbar?

I'm trying to make a very basic userChrome.css file to hide this 1 pixel line between the navbar and the current web page.
I scrolled and tried all this original css firefox but I can't find what class I have to edit to do that..
Found the tag by stripping down a stylish style piece by piece.
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(:-moz-lwtheme) {
margin-bottom: -1px !important;
}

Custom CSS showing up in inspect element but not on page?

I'm designing a site using a simple worpress theme and customising a few elements with the Simple Custom CSS plugin.
I'm trying to change the colour of the footer and I've used
.site-footer {
background: #4E5754;
color: #f29e0f;
}
This is coming though as it is changing the text colour but not the background - the new background colour is showing up when I inspect the page source but not changing on the actual page.
What might be overriding the CSS?
You can use this style for this.
.site-footer {
background: #4E5754 !important;
color: #f29e0f;
}
Or put your style under the default stylesheet.
After a bit of trial and error I realised that the two colours were actually being controlled by different elements - site.footer and footer.inner
Thanks for the help everyone!

Can't see my mobile menu anymore (Wordpress)

I have a Wordpress page, which I've set up for a friend. It all worked well, but since a few days or weeks the mobile menu (icon) doesn't show anymore. Can anyone find out what this could be?
The page: http://www.cabane-blanche.ch/
put this code in your theme style.css
nav {
font-size: 20px; }
A CSS rule in your themify-customizer.css file is causing the font size to be 0px for everything inside header.
#header { font-size:0px;
}
at line 59. You must remove this rule and it will fix this problem. It is also causing the dropdown item at "WARENKORB" tab to not show up.
If you only want to fix the mobile menu leaving the header rule intact, you can add following code to your style.css, Although I recommend the fix mentioned above instead.
.icon-menu {
font-size: 30px;
}

Resources