Remove hestia top bar [closed] - css

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
I need to remove the navbar in my Hestia Theme.
I tried .navbar {display:none;} and when I use it the top bar gets white and I need to remove it.
Could you help me with this problem, please?
Kind regards
As it showed in the piture

In Wordpress sites the main tag has a margin at the top. This is causing the white bar above the page after you removed the navigation. You can "deactivate" this with:
.main, main {
margin-top: 0 !important;
}
Edit: I have checked out your site and have found the reason. There is some top padding defined by inline CSS at the article tag, that's get added by some JavaScript, but I cannot tell you why.
But you can still turn it of with:
.elementor-page .pagebuilder-section {
padding: 0 !important;
}
This CSS rule is an extended rule already applied by Elementor, buts get overwritten by this inline CSS. I just added the !important to fix it:
If that was helpful and you used this answer to solve your problem, it would be nice if you mark this answer as accepted. If this answer doesn't work or you have other questions, please response with a comment.

Related

nth-last-child, must select number more that actual elements [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
just so you know, I CAN NOT MODIFY ON JAVASCRIPT, I CAN ONLY ADD CUSTOM CSS
I have this website
https://elt.sa
you can check the last <section> tag
I want to select it in css so I can change the color of it
I can see that it's the last section! but it's not getting selected until I write
nth-last-child(18) and sometimes 19 !
check the images below, and you can inspect the website above and modify on <style> tag inside header , (the second one)
If it is always last then you can use :last-of-type, for more details check this CSS Selectors
section.section:last-of-type {
background: #cc3329;
}
section.section:last-of-type - it selects every section.section element that is the last section.section element of its parent.
you can do it also by javascript or css
for javascript
let section = document.querySelectorAll('section');
section[section.length - 1].style.background = 'red'
or css
section:last-of-type{
background: red;
}

Changing margin in CSS does not change it on website (Cache cleared) [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
I have a strange issue.
I detected that margin-top needs to be set to 0 for my toggle menu to look well.
I changed this in CSS and cleared my cache but the problem is still there.
Please let me know what should I do to fix this.
You can see live problem here: http://onedayitinerary.com
Thanks!
Screenshot of the problem
https://i.stack.imgur.com/yk4CA.png
You didn't target the required selector. When pointing the element in DevTools, check the code that has the most importance on the right hand side.
.main-navigation ul ul li:hover > ul {
margin-top: 0;
}
Output:
The ul around, has a margin-top:25px; on it. Remove that in the file and it should work.
If you already have done that, try add "style.css?ver=1" to your stylesheet link. Sometimes that will force an stylesheet update.
you need to modify your style.css to fix this issue

Fixed footer via CSS only [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
I want to make the class .cart to be fixed at the bottom the the screen at all times like a fixed footer. Currently user has to scroll all the way to the bottom of the page to view this div. I have tried the following css but to now avail.
Although this code works fine for my in JS fiddle but not on my webpage (link below)
JS Fiddle -- > http://jsfiddle.net/Lec5yu1d/2/
My webpage -- > http://omgjewelz.com/create-your-set
.cart { position: fixed;
    left: 0;
    bottom: 0;
    width: 100%; }
Hi adding this code to your style will make it work,
You need to make footer sticky along with positioning it, So here I added bottom:0px for you.
footer.site-footer {
position: sticky;
bottom: 0px;
}
For better view, I will suggest you to use background white behind the text div, as right now its transparent so it will mess up with content,
.footer-bottom {
background: white;
}

CSS letter cut off. How to display entire text? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I have a problem with a text in a header. I use google fonts (Pinyon Script) and one of the letters is cut off. I don't understand why... I tried with the overflow properties but it doesn't work. The problem is the header in pink on www.x4v1.com/cecile/ when the screen width is between 935 and 970 pixel. The first L of the second word is cut off and I would like to show all the text. Could you help me please ? Thanking you in advance.
On chrome :
You're doing it exactly the wrong way around. The font your using is getting out of it's inherited size (line-height, letter-spacing and so on). Therefore you should give the h1 element a large size, and the span element a smaller size.
To fix this do the following:
<h1 id="myheader">
C<span class="lowerfont">écile</span>
L<span class="lowerfont">astchenko</span>
</h1>
Than add the following CSS
#myheader {
font-size: 6em;
}
.lowerfont {
font-size: .75em;
}
This is what I can see, what is supposed to be missing?

Cant get rounded corners on my image in wordpress [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I use visual composer in Wordpress and both when I make the image here rounded, either with Visual composer or directly with CSS it still does not become rounded in the corners.
Link: http://hope.ly/13Aaqw8
Does anyone have any ideas ? Suggestions ?
You can set border radius on the parent wrapper:
.wpb_column > .wpb_wrapper *:last-child {
margin-bottom: 0;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
}
But this will depend on the cropping of the image inside this wrapper.
It looks ok to me when I edited it directly in the chrome inspector. but you should post your own code really to see what you have tried.

Resources