Why is my CSS code not working in my HTML file?

Question

I am trying to put my CSS code in the same file as my HTML code, but it does not display properly (I do not want to just link my CSS to my HTML, I already got that to work). I have tried copying and pasting the code, but that does not work. Do I have to do it differently when it is in the same file?

Here is the relevant code:

<head>

    <title> Example </title> 

    <style type="text/css">

        input: textarea{
            resize: none;
        }
        input[type=button]{//set the sizes for all of the input buttons
            width: 5em;  
            height: 2em;
            font-size: 15px;
            font-weight: bold;
        }
    </style>
</head>

<body>

    <form id = "mainForm" name="mainForm" method="get" action=""  onsubmit=" return checkForm()">


        Type something: <br> <textarea id="info" name="info" > </textarea>


        <input type="button" value="1" id="button1"> </input> 
        <input type="button" value="2" id="button2"> </input> 
        <input type="button" value="3" id="button3"> </input> 

        <input type="submit" id="submit" name="submit" class="btn" value="Submit" />
        <input type="reset" id="reset" name="reset"  class="btn" value="Clear" />
    </form>
</body>

Here is a pic of how it looks when I link it

And here is a pic of how it looks when I try putting the CSS in the HTLM file

Note that CSS only defines /* ... */ for comments. // ... isn't supported by it. — Jonathan Lonowski
– Jonathan Lonowski, Commented Nov 7, 2015 at 4:36

bakki · Accepted Answer · 2015-11-07 04:51:39Z

1

no need to specify input just textarea . you can even use inline css for textarea.

<style type="text/css">

        textarea{
            resize: none;
        }
        input[type=button]{
        width: 5em; height: 2em;
            font-size: 15px;
            font-weight: bold;
        }
    </style>

edited Nov 7, 2015 at 4:51

answered Nov 7, 2015 at 4:21

bakki

3143 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

bob dylan Over a year ago

Please take a look at the pictures I uploaded

bakki Over a year ago

@bobdylan updated now it will work as you expected. removed //set the sizes for all of the input buttons(because //not an css comment)

You Old Fool · Accepted Answer · 2015-11-07 04:29:38Z

Works for me. Only problem I see is input: textarea is invalid. Just use textarea instead.

<head>
    <title> Example </title>
    <style type="text/css">
        textarea{
            resize: none;
        }
        input[type=button]{ //set the sizes for all of the input buttons
            width: 5em;  
            height: 2em;
            font-size: 15px;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <form id="mainForm" name="mainForm" method="get" action="" onsubmit="return checkForm()">
        Type something: <br> <textarea id="info" name="info" > </textarea>
        <input type="button" value="1" id="button1">
        <input type="button" value="2" id="button2">
        <input type="button" value="3" id="button3">
        <input type="submit" id="submit" name="submit" class="btn" value="Submit">
        <input type="reset" id="reset" name="reset"  class="btn" value="Clear">
    </form>
</body>

Collectives™ on Stack Overflow

Why is my CSS code not working in my HTML file?

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related