Currently, my image size is 960 x 515
How do I make it so my header image covers the whole width of my page? The code for it is above
Their are two ways to do this using CSS.
One way is to use background-size: cover; in header section this will cover the entire height and width.
Please refer to the image below for code and the output.
css code above and look for the output below.
see how it is covering the entire width and the height.
Now, talking about the other way which is by declaring the width and height in the background-size: width height;, please refer to the code and output below.
just the width size that suits you and you are good to go.
Currently, my image size is 960 x 515 How do I make it so my header...
Does my css style sheet look okay? /* Author: Your Name --> Natasha Strange /* Date: Today's Date --> September 22, 2019 /* Description: Lab Number --> Lab04 /*doctype css*/ @import url(fonts/chuckfive.css); @import url(fonts/merriweather.css); body { background-color: rgb(199,201,191); } div { border: 1px solid black; padding: 100px 100px 100px 100px; background-color: gray; } nav { text-align: center; color: rgb( 7,20,138); } header, footer { background-color: rgb(199,201,199); color:...
In my HTML and CSS pages I want to make this aside output in 2 even columns rather than the way it is (do I need a column layout?), below is my code for the html AND the CSS: HTML: <aside> <h3>Surfer Slang</h3> <dl> <dt>barney</dt> <dd>A new and inexperienced surfer</dd> <dt>boost</dt> <dd>To take off from a wave into an aerial</dd> <dt>cutback</dt> <dd>To change direction when streaking ahead of the curl</dd> <dt>gandalf</dt>...
Hi, can someone explain to me why my image is not in the middle but all the way to the top of the page? <!DOCTYPE html> <html lang=”en”> <head> <title> Pacific Trails Resort :: Yurts </title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="pacific.css"> <div id="yurthero"></div> </head> <body> <div id="wrapper"></div> <header> <h1 id="hh"> Pacific Trails Resort </h1> </header> <div id=”navbar”></div> <b><a href=”index.html”> Home </a> <a href=”yurt.html”> Yurt </a> <a href=”activities.html”> Activities</a> <a href=”reservation.html”> Reservation </a> </ul> </b> <div> <img src="images/yurts.jpg" alt="Yurt" height="250"...
How do I get my HTML and CSS to look similar to this mockup? HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>nitro site</title> <link href="css/main.css" rel="stylesheet"/> </head> <body> <header class="header"> <section class="navlist"> <img class="logo" src="assets/logobeans.png"/> <h2 class="headertitle">nitro</h2> <nav> <ul> <li><a href="index.html" target="_parent">About</a></li> <li><a href="/html/menu.html" target="_blank">Menu</a></li> <li><a href="/html/menu.html">Shop Now</a></li> </ul> </nav> </section> <section class="headerContainer"> <h1 class="heading">Nitro Coffee</h1> <p class="productDesc">Coffee is a brewed drink prepared from roasted coffee beans, the seeds of berries from certain Coffea species.</p>...
As part of this assignment we are using the base Gallery HTML and writing JavaScript code that will: 1) preload the images provided to us, 2) Create rollover functionality for each of the thumbnails in your image gallery 3) Use appropriate images found in the images folder. 4) Write developer comments to describe the variables being declared and explain the functions and logical blocks of JavaScript code pertaining to the gallery. I know it has to be an external JS...
How do i make my html show 10 results per page, and how do i make the books clickable to show results about them? <!DOCTYPE html> <html> <head> <title>Google Books Search</title> <script src="https://code.jquery.com/jquery-2.1.4.min.js"> </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script> <style> body{ background:lightblue } .wrap{ max-width:400px; margin:auto; margin-top:10px; } .pagination, pagination-last{ float:left; } a{ text-decoration:none; padding:15px 20px; border:1px solid black; border-right:none; background:#f2f2f2; font-size:18px; font-weight:bold; } .pagination-last a{ border-right:1px solid black; } a:hover { background:orange; color;white; } </style> <!-- <script src="js/main.js"></script> --> <script> function B_Search()...
Hello, I am designing a website for my class. I am using HTML/CSS/Jscript. I need to have my text in the body, white. All text and the picture centered but how do I have margins on the left and right side?. I have a figcaption and I dont know have to place it under the picture but I am having a hard time. Can you help me? Thank you! HTML <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet"...
can you do this js and html question. ill give you the html and js and css files just fix my error use if and else like what i did dont use switch just fix my erorr. <!DOCTYPE html> <!-- Webpage HTML document for Lab 4. Authors: Amirhossein Chinaei, Andriy Pavlovych For: EECS 1012, York University, Lassonde School of Engineering --> <html lang="En"> <head> <meta charset="UTF-8"> <!-- title for web page --> <title> EECS1012: Lab 4 - Computational Thinking </title>...
Hello, I was wondering if you could possibly think of ways to improve my home page then I would like you to do so. I know it could be better. Thank you. index.html <!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"> <title>Untitled Document</title> <!-- Bootstrap --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"> <!-- jQuery library --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <!-- Latest compiled JavaScript --> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script> <link href="style.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> </head> <body> <header> <nav class="navbar...
Hello, this is my code. moest of the things works but when select the price, i just dont get my total. can someone help me out . thank you My queshion is also here The page will simulate the site for a Chicago-based small bus line that travels to St Louis, Milwaukee, and Detroit. Here are the requirements: The home page (i.e. the main page) should simply be the heading, image, and slogan of the site. The home page should NOT...