Html5 & css table problem


#1

i am having a problem with some basic html and css ithink it has to do with my html file trying to figure out tables, can someone please tell me what im doing wrong and how to make it look identical to my example

here is the css

here is the html

this is the example that i am seeking.

i a trying to be as basic as i can, i haven't been introduced to flex-box or anything like that, any kind of help or links to a topic that covers this in detail i really prevaricate it thank you!!


#2

you could use the inspector to look at how your example is coded?

Looks like you are pretty close? i would add text-align: center to your nav to center your inline navigation menu.

maybe some padding for your <section>'s, but that is pretty much it? What differences am i missing?


#3

html {
background-color: purple;
}

body {
width: 800px;
margin-left: auto;
margin-right: auto;
background-color: white;
}

pageWrapper {

display: flex;
}

section, aside { flex: 1; }
article { flex: 2; }

footer {
text-align: center;
}

nav {
padding: 15px;
display: flex;
justify-content: center;
}

nav ul {
margin: 0px;
list-style-type: none;
padding: 5px 0px 5px 0px;
}

ul li {
display: inline;
padding: 5px 0px 5px 0px;
}

ul li a:link,
ul li a:visited {
color: green;
text-decoration: none;
}

ul li a:hover {
background-color: #c8b99c;
}
i.e flex-box HOWEVER this is not how i am supposed do the assignment i was supposed to be using the old way of "display: table;" "display: table-cell;" the example is a screenshot thats why i cant simply inspect it. sorry if it left out details can someone explain how tables work even tho i feel flex is way more appropriate


#4

i would first learn about table, tbody, thead, tr, td. start here, and then later you can use the css properties once you understand the tables coded in html


#5

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.