Need Assistance with Realtime CSS Issue - css

I am currently working on CSS design on my site FortheStartup.com
I am stucked at a point. The header of site is BLUE COLOR (#0d47a1) but from somewhere a white line is appearing just over the header.
I have looked around to see if there is any CSS padding etc but not able to fine.
Can anyone assist?
(I can post screenshot if required)

Looks like it comes from your #wrapper?
#wrapper {
padding: 10px 0 40px;
}

Related

Wordpress + Flatsome Theme Appearance Display Limitation

Using the Flatsome theme I have a few questions and would like to try and get them solved myself, is this the manner in which I should direct those questions?
I'm running WooCommerce I'd simply like to know how to make the breadcrumbs bar a little smaller where it displays the name.. on the single product page it looks great but I see no settings to edit it on the display list, i can show you a screenshot of the problem here (ALSO I WANT TO CHANGE THE WHITE BACKGROUD WHERE IT SAYS "HEADSHOP" TO SOMETHING MORE MATCHING) -- THERE ARE NO OPTIONS FOR CHANGING ANY OF THIS?
I'd really like to be able to edit this area and I'd like to gain more access to it, this theme appearance editor area wont let me do it, I've tried and tried to no avail!
With that being said, this is just the display of all the main products.. What throws me off is that in the Single Product page it formats exactly the way I want it to on all pages, see example here..
Im not an expert but I suggest you to put the URL of your website as minimum, because is going to be difficult to help you without what you have tried or the code of your website.
Following with the question, you can reduce the height of the container using some CSS. By default both margins (in this case the padding) are in 20px, so i just reduce them to 0.
.featured-title .page-title-inner {
padding-bottom: 0px;
}
.page-title-inner {
position: relative;
padding-top: 0px;
min-height: 60px;
}
This is how it looks with the modifications in the margins.
https://i.stack.imgur.com/r7KX7.jpg
https://i.stack.imgur.com/bMmNd.jpg
But still, I don't understand what it's keeping the text so high in the container.
To change the background color of that button, you can modifiy the CSS Property.
.nav-tabs > li.active > a {
background-color: red;
}
This is how it looks.
So you just need to put that CSS in your theme.
If my answer helped you, please consider marking it as an Answer.

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;
}

Strange spacing in WordPress website

I had a design sliced to html and it looked great. Then I converted it into a WordPress theme and a spacing appeared at the top of the website in every browser except FF. When turning to firebug the head tag seems to be empty and all html that should be there, appears to be in the body.
https://www.opolo.nl/kitchenaid/
Did anybody have this problem before and have a solution? Since this is a live website, I solved this by giving the header a position of absolute, but since a new project shows the same issue, I'm looking for a solution.
Foundation was used for the responsive part. Could it be WordPress and Foundation have problems? All javascript files are included by wp_register_script and wp_enqueue_script and are located in the footer. Moving them to the header didn't solve the problem.
you have a padding and font size set and something that counts as text within your body before your header
body{
padding: 0px !important;
font-size: 0px !important;
}
its not really a good idea to be setting dimensions for html body etc if not needed. a lot of code examples will style body tags so if using them you should change the container names from body to something else.

I need to center the Magazine Basic Wordpress them on my page

I just installed WP Magazine Basic. The entire theme is left justified. I have been through the editor for an entire already trying to center it. The site is http://www.sportsjabber.net
Something so simply is driving me insane. I can figure all the rest out if I can just center the darn thing.
Change your CSS like this:
body {
margin: 0 auto !important;
}
on style.css line no.33
That will work. Cheers!!!

CSS background image for asp button control

I've been stuck on this for 3 days now.
I have two pages that basically share some code for a search feature on my website, here's my code
The CSS
#btnSearch {
display: block;
color: #ffffff;
width: 100px;
height: 27px;
border: 0;
padding: 0;
background: transparent url("Images/btnSearch2.png");
}
When I'd gotten the one page working, I copied that code to the page where it doesn't work, but it hasn't made any difference, here's the HTML (don't worry about the inline css, that's just for convenience while I'm working on it...)
EDIT1:
All other classes work correctly as they (along with the css above) come from a stylesheet at <webroot>/App_Themes/Default... The images go in a subdirectory of this location.
I don't see why this code works on 1 page and not the other when all the other CSS classes work on both pages...
Have you tried the absolute image path and see if it works that way?
Maybe it´s a Browser problem: Try to open the file that doesn´t work in another browser.
Maybe you have a tag named the same way #btnSearch in the pages where the styles don´t apply.
Is the path to the background image correct for the page where the code doesn't work? Or even the path to the CSS file?

Resources