One way you could make it even better is to set all the animations to the same duration and prevent them from queueing, so everything would change color at the same time.
thanks! how to center the heading and bring the new quote button to right
To center the heading, put it inside a div with one of the bootstrap column classes (e.g., col-12). Right now it’s in a container that has display set to flex (from the row class), which means its width isn’t 100% of the width of its container.
thanks… anything about ‘New quote’ button
Parent in which you want to position it to the right:
position: absolute; right: 0; /* Change this based on how far you want it from the edge of the containing element. It seems like in your case the padding on the containing elements already gives it just the right amount of distance. */
I also just noticed you specify the font as Ubuntu, but for some reason setting that as the font for
body has no effect. I guess it’s because Bootstrap already has font settings for individual elements which take precedence as they’re at a finer-grained level. You can use the
* selector instead of
body to fix this. On a similar note, it’s odd that you’ve chosen Times New Roman and serif as your fallback fonts, given that Ubuntu is sans-serif. Is this intentional?
thanks! for the suggestions on selector and positioning. i just wanted ubuntu font so i searched and pasted the whole font thing. didn’t know
The fact they’re both in a single Bootstrap
.row is causing their width to shrink if the content doesn’t fill the entire line.