I would like to have something like this at the bottom of my chrome extension:
https://gyazo.com/89f5f73f1f4fc24a764c058dbfee24de
Mine currently looks like this:
https://gyazo.com/f71a60149cc0301f965e7f0736815505
This is my html code:
https://gyazo.com/2fb446ed0b7fd61bde06d201f175495d
What should I do to get mine looking like the first one.
I think that you would want to use CSS to solve this issue. The code of which should be found on this website. It should have all the information on how to split the footer in half. You would also want to take the background color out of the CSS as well.
You need CSS for this. Add the class footer to the td
td.footer{
background-color: none;
}
td.footer a {
color: aqua;
}
Related
I am new to CSS and have an issue on my current project. I am sure there is a simple solution and it would be great to get some ideas to solve the problem.
I designed a Website with a navigation on top by using CSS. The different sites in the navigation have the same structure centrally "steered" by the CSS code. The only difference is the background-image per site which I changed by the body class:
body.Site1 {
background-image: url(Picturewithdarkbackground.jpg);
}
body.Site2 {
background-image: url(Picturewithwhitebackground.jpg);
}
Problem: The navigation text color in the header for one specific html site (with dark background) can hardly be seen due to the black text. My intention is to change the black text color in the Navigation only for this one specific Html site to white text color.
I have tried to change the header color but it is not working, it should only change it for the site with the black background (Site1) see below ->
body.header.Site1 {
color: white;
}
header.Site1 {
color: white;
}
How can I change the text color in the Navigation header for one specific html site?
Any simple Idea?
Thanks for support!!!
You seem to have added the "Site1 / Site2" class to the body.
So to change the header color for the specific site your CSS will have to look something like this:
body.Site1 header {
color: white;
}
Also, .header or header? Is it a class or a tag?
You have your order mixed up in your css. The Site1 should go before the header and after the body
Amend it to body.Site1 header{color:white;} (leave a gap between Site1 and header as header is a standalone tag, not a class belonging to Site1). Then it should work.
Good luck!
p.s. a footnote, if you can avoid using a picture as a background (i.e. if it's just one plain dark colour, not an image), then you'd be better off finding out what that colour is and using the appropriate hex code. It would save on loading time. Just a tip!
I was editing my styles.css on a WordPress site to remove the title on a particular page. To do this I used the following code:
.post-name .entry-title { display: none; }
This removed the title like I expected. I then enter the following code to remove a border that was after the header:
.post-name .entry-header::after { border-bottom: none; }
This bit of code didn't work. I then removed both pieces of code that I added to try and start from scratch. Now when I view the page, my title is still missing, but the bottom border stayed. I tried clearing my browser's cached images and files, but that didn't work.
What could have caused the title to be permanently missing and why didn't the second bit of code work (I also check my specificity and the above ::after code took priority)?
Thank you!
that is odd.
try making it re-appear by
.post-name .entry-title { display: block; }
My team developed the portfolio website.
But we are facing with strange issue.
We pasted this issue in the theme support, but it is not yet solved.
While loading this page, it is giving sometimes like this:
and sometimes like this(We want like this):
How to get rid of this??
I'm not very familiar with Wordpress but if you have access to the CSS that controls the template them maybe you can use Firebug or Inspect Element to find out if the upper and lower divs have any class specifications, and then set the margins to zero in the CSS file like this:
I'll pretend Firebug revealed div classes upperdiv and lowerdiv like this:
<div class="upperdiv">photos</div>
<div class="lowerdiv">photos</div>
in the CSS you could try:
.upperdiv {
margin-bottom: 0px;
}
.bottomdiv {
margin-top: 0px;
}
Hope this helps.
I want to change the subnavs on this code but everytime I try it takes the parent element (the background image from above.
I would have thought adding the following code would get rid of the background image for the subnavs but it doesn't.
ul.subnav li {
background-color:000;
}
What I want is to do some basic css for the subnavs with the names of each link. Nothing fancy.
Heres a link to the fiddle
http://jsfiddle.net/mitchelll182/t7QQ8/1/
Ok, so I see you're doing a CSS only menu, but that involves putting classes on everything and it ends up being a huge code mess. I think a better way would be to use jQuery. Something like this: http://jsfiddle.net/ewB9b/
See how the HTML code is nice and clean? Just nested UL's with one class. Now in the CSS, you can easily style the main links differently from the drop-downs. Read the comments in the CSS to see what's what.
.
Try:
ul.subnav li {
background-image: none;
background-color:000;
}
I created a html page that provides to print his's content(window.print). I would like to add page footer for print version with the following CSS.
display: table-footer-group;
But I want to have a page footer in last page. The above CSS produces the page footer every page. How can I solve it? Thanks.
You can try something like that:
#page:last {
/* footer css here */
}
Additional reading.