Html & css


#1

Hello,

I have a question I am trying to make three columns, without the visiable lines and trying to a line all subtitles in one row and I don’t know how to do that.
Like this:


So I would like some help to a line the subtitles in the same row.


#2

you could use display: inline-block, but this doesn’t scale very nice

better would be to use float: left, this scales better

If further assistance is required, please include your code

mdn-float


#3

My code is, first:

HTML;

<h4>Books</h4>
<h5>Web Archive</h5>
<h6>Videos</h6>

CSS;

h4 {
    color: #FFF; 
    font-size: 30px; 
    font-family: "Pacifico", Helvetica, Arial, sans-serif; 
    line-height: 1.3;
   float: left;
}

h5 {
    color: #FFF; 
    font-size: 30px; 
    font-family: "Pacifico", Helvetica, Arial, sans-serif; 
    line-height: 1.3;
   float: left;

}

h6 {
    color: #FFF; 
    font-size: 30px; 
    font-family: "Pacifico", Helvetica, Arial, sans-serif;
    line-height: 1.3
     float: left;
}

#4

why do you have different headings (h4, h5 and h6)? this means each heading has different margin, this make it really different to put them on the same line.

Why not use the same heading? If for whatever reason not possible, overwrite the margin

you should really refactor this code, if we want to apply the css rules to different elements we can simply do:

selector1, selector2 { color: red }

#5

Since all headings have thesame properties, why not write this way:

h4, h5, h6 {
color: #FFF;
font-size: 30px;
font-family: “Pacifico”, Helvetica, Arial, sans-serif;
line-height: 1.3;
float: left;
}


#6

i suggested this:

but wanted to learner to find the final suggestion himself, i only wanted to push in the right direction