CODEWITHSUNDEEP
htmlcss
Blue Duck
Blue Duck

Reputation: 56

How do I change textbox size using css? And how do I connect my css file with my html file

I want to change my textbox size using HTML, for now I only have this as my

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            background-color: grey;
        }
    </style>
</head>
<body>
    <label>Enter your question:</label><br>
    <input type="text" id="myquestion" placeholder="Your question here"><br>
    <button type="button" id="mybutton">Submit</button>

    <script src="script.js"></script>
</body>
</html>

First of all, how do I connect my css file with my HTML file? my css file name is style.css Second, how do I change <input type="text" id="myquestion" placeholder="Your question here"><br> size using css? I kinda wanna at least use css because for now I know nothing about css. It'll be really good if you guys can help me. Thanks!

Upvotes: 1

Views: 47

Answers (1)

Ravi Mashru
Ravi Mashru

Reputation: 517

You can load your CSS file in your HTML page by adding the following line within the <head> tag:

<link rel="stylesheet" href="style.css">

When you say you want to change the size of the input, I assume you mean you want to change its width. You can do this using:

#myquestion {
  width: 400px;
}

To learn about HTML and CSS, I highly recommend going through W3Schools.

Upvotes: 2

Related Questions