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 6 years ago.
Improve this question
I'm having trouble with my CSS.
It's not working even though it is linked correctly to my HTML
document.
The files are in the same folder.
Both files are saved in the correct format.
From what I can see, I don't see anything wrong or missing from the
CSS.
The CSS
The HTML
It doesn't look like your css matches your html, you don't have any of those tags in your html so the css wont do anything.
Your html references class="header" (btw you are missing quotes around your class in your html, you should add those in.) your css just has header
You should have .header { ... } not just header {..}
You're using header class.
It should be in double quote.
i.e
In css file you've not added dot(.) before class header.
Class should be added with dot(.) and id with hash(#)
Try this :)
In HTML5, header is a tag.
You can use it
Ref. http://www.w3schools.com/tags/tag_header.asp
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 10 months ago.
Improve this question
I'm new to HTML coding, and I seem to be having problems with the <img> tag. My code, which I type in VS Code, is linked up to a Github repo, which is linked to Netlify which I use as the host for the site.
I'm trying to get an image into the <main> section of the code, but I just always get the alternative text for the image.
<img src="tratt_1080x1080.jpg" alt="lot182" class=".floatRight">
That's the code for the image.
.floatRight {
float: right;
width: 300px;
max-width:50%;
margin-left: 10px;
margin-bottom: 10px;
}
That's the CSS code for the class floatRight.
the result on the actual site
Your image and files should be in the same folder.
Also you don't need to use "." in your tag. Remove "."
In css we use a . to indicate that the following name is a class. So in html we don't need that name, because we already specify that it's a class. (remove the dot in the class atribute).
<img src="tratt_1080x1080.jpg" alt="lot182" class="floatRight">
There can multiple reasons of it why it is happening, but make sure you have you have spelled your image file correct in the img tag tally it with care even be careful about the extension of the image its '.jpg' or 'jpeg'.
Second make sure your image is place at the correct place location. According to your img tag it must be placed in the same folder as your html file is placed
Third correct your class attribute don't place a dot with it here, you should place it to access this class in CSS file with a dot not where you are defining it in the html tag
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 recently started learning HTML and CSS. I've been trying to link my css for hours. I've searched more than 10 forums but nothing seems to be solving my issue. Ive tried to change the order of the [href="stylesheet.css" rel="stylesheet" type="text/css"], I've tried using other browsers, I've tried to clean my cache and obviously my html and my css are in the same folder.
Here is a screenshot of my html:
https://i.stack.imgur.com/PRYNU.png
Here is a screenshot of my css:
https://i.stack.imgur.com/v5fvP.png
Here is the live preview of my html:
https://i.stack.imgur.com/fP9LJ.png
Thanks in advance
It's because your CSS it's wrong, try this.
a { color: red; text-decoration:none }
It's not necessary a style in a .css file
In your css:
Don't say a{style="..."}, you use style="..."in your HTML-tags.
Correct way
a {
color: red;
text-decoration: none;
}
or
a{color:red;text-decoration:none;}
if you want to keep it in one line.
I don't think there is another mistake, the only thing I can come up with is that your CSS file is not in the same directory as your HTML file. If you want to have it in a different location, you have to put the path in your href.
Is the css file located in the same folder as the html file?
You have to remove the style=" part and the " near the end of line 1 in your css file. It breaks the stylesheet and your styles are not apllied because of this.
Greetings, Mario.
you can add ?=1 in front of your stylesheet.css?=1. It should resolve your issue
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
My Blogger Soho theme main page has two columns listing the posts complete with pictures. The gaps between the columns are too close. May I know if there is a css code to improve that?
Sorry if this question has been answered as I could not find one after searching and I am a newbie in css.
https://retireby50sg.blogspot.com
Thanks in advance for advice!
Actually your image width is going out of div so try to reduce the width of image. here is the css try this
.snippet-thumbnail img {
width: 95%;
}
If you don't post your code is so hard to give you a proper answer, but I could say you that you should open the CSS code about your theme and find the two columns tag or id or whatewer the theme uses, then you could use margin or padding property to make the gap between both bigger.
Use of margin and padding (Because you said you're a newbie hahahaha)
Margin: https://www.w3schools.com/css/css_margin.asp
Padding: https://www.w3schools.com/css/css_padding.asp
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
This is the page I am working with: https://books.fcostry.cz/
What I am trying to do is hide the searchbox (.vc-searchbox) on hover of the Books logo on the left upper side (.vc-headerlogo).
.vc-headerlogo:hover .vc-searchbox{ display:none; } is not working and I really don't know why.
I would like to do it using CSS but I am open to any solution. Thanks for any answer.
.vc-headerlogo:hover .vc-searchbox{display:none;}
Means that .vc-searchbox nested in .vc-headerlogo will not be displayed when overing .vc-headerlogo
In your page, this is not the case: .vc-searchbox is not in .vc-headerlogo, but after (they are sibling). In that case, use the CSS sibling selector +
In other words,
.vc-headerlogo:hover+.vc-searchbox{display:none;}
should work better
Since you are open to options, use jQuery
$(document).ready(function(){
$('.vc-headerlogo').hover(function(){
$('.vc-searchbox').hide();
});
});
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 HTML like this:
<div class="myList">
<select>
<option value="1">Item1</option>
<option value="2">Item2</option>
</select>
</div>
All the CSS is perfect. But then, when I use some AJAX, and then I do $('.myList').html(...), all the styling of the combobox disappears.
I tried some of the ideas in other threads, but none of them worked.
When you are call ($element).html you overwrite the HTML what is currently there, therefore you may actually be overwriting the HTML which sets the div (and therefore styling) use $(element).append instead, here is the API for .append() http://api.jquery.com/append/
Probably because you add your styles with jquery, so you add your styles in the html as an attribute with style="", you can add your styles in the css and with jquery just add the classes. And when you change the html add the classes again otherwise you'll miss the styling.