Need you to explore two of the primary means of positioning elements using CSS. Recreate the...

Question

Question

Need you to explore two of the primary means of positioning elements using CSS.

Recreate the screenshots below using floats. Absolute Positioning 2 Red Green Footer Blue Purple

engineering Computer-Science

Add a comment Improve this question Transcribed image text

Answer 1

Answer #1

css file/2.css

body {
color: #fff;
font: 600 14px/24px "Open Sans", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", Sans-Serif;
}

.box-set,
.box {
border-radius: 6px;
}
.box-set {
background: #eaeaed;
height: 500px;
position: relative;
}
.box {
background: #2db34a;
height: 80px;
line-height: 80px;
position: absolute;
text-align: center;
width: 80px;
}
.box-1 {
float: left;
top: 0;
left: 2%;

background: red;
}
.box-2 {
float: right;
top: 100;
right: -40px;

background: green;
}
.box-3 {
float: left;
bottom: -10px;
right: -40px;
background: blue;
}
.box-4 {
float: right;
bottom: -10px;
left: 2%;
background: purple;
}

html file/1.html

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="1.css"></head>

Screenshot

Add a comment

Answer 2

Similar Homework Help Questions

Need you to explore two of the primary means of positioning elements using CSS. Recreate the...

Need you to explore two of the primary means of positioning elements using CSS. Recreate the screenshots below using floats. Red Green Absolute Positioning 1 Footer Blue Purple
Python problem: 1. The colors red, blue, and yellow are known as the primary colors because...

Python problem: 1. The colors red, blue, and yellow are known as the primary colors because they cannot be made by mixing other colors. When you mix two primary colors, you get a secondary color, as shown here: When you mix red and blue, you get purple. When you mix red and yellow, you get orange. When you mix blue and yellow, you get green. Create a text file with the names of two colors in it. Write a program...
NEED HELP WITH ALL PLEASE. MICROBIOLOGY You have stained a bacteria using the Gram staining technique...

NEED HELP WITH ALL PLEASE. MICROBIOLOGY You have stained a bacteria using the Gram staining technique what color would any endospores be if present? A. Colorless B. Green C. Pink D. Blue E. Purple 2. If you omitted the Safranin step in a gram staining procedure, what would be the color of a Gram-negative bacteria? A. Colorless B. Pink C. Green D. Purple E. Blue 3. Bacillus licheniformis would be what color and shape after a Gram staining? A. Purple...

You are required to design a colour mixer. It is allowed to use a maximum of only two colours at a time from the available three that are Yellow, Red and Green. The combination of the colours and...

You are required to design a colour mixer. It is allowed to use a maximum of only two colours at a time from the available three that are Yellow, Red and Green. The combination of the colours and their results are shown in the diagram below, and only Orange and Green colour outcomes are acceptable. Blue Red Yelow Purple Green Orange A. Prepare the truth table for this scenario B. Deduce the canonical sum of products that give you the...
need help on 1 and 2 Post Lab Questions Answer the questions below: 1. Which elements...

need help on 1 and 2 Post Lab Questions Answer the questions below: 1. Which elements are a. Orange b. Yellow c. Liquids 2. When were the elements discovered? Using a periodic table color elements discovered between BC and 1600 AD green, elements discovered between 1601 and 1900 blue, and elements dis- covered between 1901 and the present red. FIGURE 12.2 IMTA VA VIA Lanthanide series Actinide series 3. Which element derives its name from the German word Kobald meaning...
Hi, I need help writing a code for this. The language is python 3, and we...

Hi, I need help writing a code for this. The language is python 3, and we cannot use things like break, continue, exit(), lambda, map, filter, raise, try, except, and assert in our code. Thank you! Implement one of the sorting algorithms from class, either bubble, selection or quick sort with the following modification. Call the function "color_sort(the_list)" Each element is now a list (or tuple) with two elements. The first element is the number value that you need to...

For each of the solutions described below, determine the pH range for the solution using the...

For each of the solutions described below, determine the pH range for the solution using the information given and the indicator chart Solution A Indicator Used alizarin yellow Indicator color Yellow bromthymol blue yellow methyl violet violet Range bear the 21 less than 7.6 leathen lib really them 5.1 Gooher the 3.2 bromcresol green green methyl red red The pH range for solution A is 3.2 7.6 Solution B Indicator Used methyl red Indicator color yellow Range leroth 67 alizarin...
In the future, what do you think will be the primary source of energy for transportation...

In the future, what do you think will be the primary source of energy for transportation and electricity? I have this chemistry HW and I need help with these 3 questions (question 13, 15 and 16) 13) In the future, (eg, 2037), what do you think ill be the primary sources of energy for a. Transportation? b. Electricity? Explain and justify. Provide any references you've used to arrive at your answer. A good starting reference is McQuarrie, interchapter L. 15)...
Overview The purpose of this assignment is to explore the manner in which CSS styles can...

Overview The purpose of this assignment is to explore the manner in which CSS styles can be transported into an external file. Assignment You may find the W3 Schools examples on this process useful (http://www.w3schools.com/css/css_howto.asp). Once you have a working understanding of how to move your stylesheet outside of the HTML file and into a CSS file, remove and style information from your Weekly Assignment #02's HTML file and move it to an externally attached CSS file. When you are...

IN C++!! Program 2: BACK AWAY FROM THE TV! If you sat close enough to an...

IN C++!! Program 2: BACK AWAY FROM THE TV! If you sat close enough to an old TV, you could see individual (R)ed, (G)reen and (B)lue (or RGB) “phosphors” that could represent just about any color you could imagine (using “additive color model”). When these three color components are at their maximum values, the resulting color is white from a distance (which is amazing – look at your screen with a magnifying glass!). When all are off, the color results...

Need you to explore two of the primary means of positioning elements using CSS. Recreate the...

Homework Answers

Add Answer to:
Need you to explore two of the primary means of positioning elements using CSS. Recreate the...

Post as a guest

Earn Coins