Hello I was hoping someone could correct my coding errors. I have a CSS file that needs to be formatted to look like the first image but it currently looks like the second image. Can someone please help me with it? Thank you! CSS MAIN FILE: html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: normal; } ol { padding-left: 1.4em; list-style: square; } ul { padding-left: 1.4em; list-style: square; } table { border-collapse: 0; border-spacing: 0; } /* end reset browser styles */ html { background-color: rgb(253,248,171); } body { background-color: rgb(255,255,255); border: 0; box-shadow: 3px 10px 10px 10px grey; width: 724px; margin-top: auto; margin-left: auto; margin-right: auto; padding: 5px; } h1 { font-size: 20px; font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; text-align: center; letter-spacing: 1px; color: red; text-transform: capitalize; background-color: rgb(226,235,180); padding: 5px; margin: 5px; } h2 { font-size: 1.7em; font-family: "Arial Narrow", Arial, Helvetica, sans-serif; color: coral; border-top: #666; border-bottom: #666; padding-top: 3px; padding-bottom: 3px; margin: 5px; overflow: hidden; } #fruit { float: width: 100px; height: 100px; margin: 5px; -webkit-shape-outside: shape-outside: } .sidebar { width: 250px; float: right; margin: 5px; background-color: rgb(250,235,199); padding: 5px; border: 1px dotted rgb(252,101,18); border-top: #666; border-radius: box-shadow: } .sidebar h2 { border: none; margin-top: 0; padding: 0; }
Hello I was hoping someone could correct my coding errors. I have a CSS file that needs to be formatted to look like the first image but it currently looks like the second image. Can someone please help me with it? Thank you!
CSS MAIN FILE:
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: normal;
}
ol {
padding-left: 1.4em;
list-style: square;
}
ul {
padding-left: 1.4em;
list-style: square;
}
table {
border-collapse: 0;
border-spacing: 0;
}
/* end reset browser styles */
html {
background-color: rgb(253,248,171);
}
body {
background-color: rgb(255,255,255);
border: 0;
box-shadow: 3px 10px 10px 10px grey;
width: 724px;
margin-top: auto;
margin-left: auto;
margin-right: auto;
padding: 5px;
}
h1 {
font-size: 20px;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: normal;
text-align: center;
letter-spacing: 1px;
color: red;
text-transform: capitalize;
background-color: rgb(226,235,180);
padding: 5px;
margin: 5px;
}
h2 {
font-size: 1.7em;
font-family: "Arial Narrow", Arial, Helvetica, sans-serif;
color: coral;
border-top: #666;
border-bottom: #666;
padding-top: 3px;
padding-bottom: 3px;
margin: 5px;
overflow: hidden;
}
#fruit {
float:
width: 100px;
height: 100px;
margin: 5px;
-webkit-shape-outside:
shape-outside:
}
.sidebar {
width: 250px;
float: right;
margin: 5px;
background-color: rgb(250,235,199);
padding: 5px;
border: 1px dotted rgb(252,101,18);
border-top: #666;
border-radius:
box-shadow:
}
.sidebar h2 {
border: none;
margin-top: 0;
padding: 0;
}
Trending now
This is a popular solution!
Step by step
Solved in 3 steps