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 5 years ago.
Improve this question
I am working on a big project to improve it as like any other existing project I have some limitation which I need to find a workaround for it though that might not be the best option. I have some texts in the database and some of them contains image tags such as
<img src="http://www.cbc.ca/kidscbc2/content/the_feed/_848/april_fool_848.jpg" width="20" height="8" />
Now the problem is that these images have width and height attributes which I do not need them at all and I need to use my own styling. I know there are different ways to fix such as cleaning the db text or parse the text and clean it before wrapping it to html but these are not doable for me right now based on some limitation I have. So I need to do this in a css:
just to give you a simple version of what I want here is a simple code:
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<style>
img {
width: 100% !important;
height: 100% !important;
}
</style>
</head>
<body>
<div style="width: 200px; height: 300px;background-color: yellow;">
<img
src="http://www.cbc.ca/kidscbc2/content/the_feed/_848/april_fool_848.jpg"
width="20" height="8" />
</div>
As you see I even added style to img with !important to overwrite the styles.
However still the direct attr take effect. Any idea?
It works here - you just had some space in your image src address: (and the closing body and html tags were missing).
img {
width: 100% !important;
height: 100% !important;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div style="width: 200px; height: 300px;background-color: yellow;">
<img src="https://s3.amazonaws.com/telegraph_journal/story-pictures/100141831/leadlandscape/20170303_083808_1.jpg" width="20" height="8" />
</div>
</body>
</html>
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 8 months ago.
Improve this question
My picture is not displayed. I've tried several browsers and different image formats. Unfortunately it doesn't always show up for me.
<!DOCTYPE html>
<html lang="en ">
<head>
<meta charset="utf-8" />
<title>Title</title>
</head>
<img scr = "image.png">
</body>
</html>
You need to open your body tag
and the image needs a src attribute, not scr https://www.w3schools.com/tags/att_img_src.asp
<!DOCTYPE html>
<html lang="en ">
<head>
<meta charset="utf-8" />
<title>Title</title>
</head>
<body>
<img src="image.png">
</body>
</html>
Change scr to src in the img tag.
Also put it properly inside a body tag.
Something like this
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Title</title>
</head>
<body>
<img src="image.png" />
</body>
</html>
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 2 years ago.
Improve this question
I am trying to write this html code but the CSS attributes just don't affect my code.
HTML file:
.hello{
background color: #333;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="hi.css">
</head>
<body>
<div class="hello">
<p> hi </p>
</div>
</body>
</html>
background color is not valid. It should be background-color
.hello{
background-color: #333;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="hi.css">
</head>
<body>
<div class="hello">
<p> hi </p>
</div>
</body>
</html>
You should add a - between background and color. You are providing different CSS attributes instead of one.
Do this:
.hello {
background-color: #333; // Add an hyphin
}
Try this
.hello {
background-color: #333;
}
Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 7 years ago.
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.
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.
Improve this question
Take a look at my code. Tell me what I am doing wrong.
CSS File - Name style.css
#color{
background-color: #yellow;
}
HTML File
<!DOCTYPE html>
<html> <link rel=”stylesheet” href=”css/style.css” type=”text/css”>
<head>
</head>
<body>
<div id=“color”> color </div>
<p>My first paragraph.</p>
</body>
</html>
Is my HTML link wrong?
This is the updated HTML File
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="color"> color </div>
<p>My first paragraph.</p>
</body>
</html>
It's either : background-color:yellow; or background-color:#FFE51E; but not background-color:#yellow;
Plus you are using the wrong quotation marks : ” instead of " and you have to put link tags in head tags.
Which gives us this :
jsfiddle
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="color"> color </div>
<p>My first paragraph.</p>
</body>
</html>
the # symbol us used for the hexadecimal color like #fff if you wanna one of the colors by name you just use the name without any symbol:
background-color: yellow;
Working jsfiddle
CSS:
#color{
background-color: yellow;
}
HTML:
<html>
<head>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="color"> color </div>
<p>My first paragraph.</p>
</body>
</html>
your doing wrong in your css background-color: #yellow; is wrong. It should be background-color: yellow; or background-color: #FFFF00;.
you are using External Styling of CSS so add a link to it in the <head> section of the HTML page
If this still doesn't work check the path of your css. Are you sure this is a correct path?
href="css/style.css"
Here's a tutorial how to use background-color http://www.w3schools.com/cssref/pr_background-color.asp and here's the list of colors in css http://www.w3schools.com/html/html_colornames.asp
I actually fixed it by taking out the path for the link. I had copied it on by accident and that was why it wasn't working. Here is the working code.
#color{
background-color:yellow;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div id="color"> color </div>
<p>My first paragraph.</p>
</body>
</html>
What you are asking is how to link style sheet in text editor. If you use text editor , first thing you should do is to put all the (.css, .js, .html) into one folder. Then you can use only your file name with the extension to link. This is the easiest way if you use text editor. In this case I think you have linked external stylesheet properly. I guess thr problrm is with 'background-color:yellow;' don't use # with color name.
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 8 years ago.
Improve this question
Okay, so Codecademy gave me this code to create what looks like box using div and background-colors:
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>Result</title>
</head>
<body>
<div></div>
</body>
</html>
and the css...
div {
background-color: #cc0000;
height: 100px;
width: 100px;
}
It worked fine. I got a red box. Afterwards I tried to do it on my own but its not working. My code's pretty much exactly the same but don't know what's going on. Here's mine:
<!DOCTYPE HTML>
<html>
<head>
<link type="text/css" rel="stylesheet" href"boxes.css"/>
<title> Boxes </title>
</head>
<body>
<div></div>
</body>
</html>
the css...
div {
background-color: #2D1132;
height: 100px;
width: 100px;
}
If someone could explain how I can make this work that would be great!
You have not referenced the stylesheet correctly.
<link type="text/css" rel="stylesheet" href"boxes.css"/>
Should be:
<link type="text/css" rel="stylesheet" href="boxes.css"/>
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 9 years ago.
Improve this question
<!doctype html>
<html>
<head>
<title>Single Column</title>
<link rel="stylesheet" type="text/css" href="single.css>
</head>
<body>
<div id="container">
<div id="content">
<h2>Here's some content</h2>
<p>This is where a story would go</p>
<h2>Here's more content</h2>
<p>This is another story</p>
</div> <!-- end content -->
</div> <!-- end container -->
</body>
</html>`
The code above is my HTML file and the code below is my css file. when i open the browser and search local host it displays the content but the font is not changing?
body
{
font-family: arial,helvetica,sans-serif;
}
#container
{
margin: 0 auto;
width: 600px;
background: #FFFFFF;
}
#content
{
clear: left;
padding: 20px;
}
You are missing the closing quote in your link href for css
<link rel="stylesheet" type="text/css" href="single.css">
^^ missing quote