How would I make this in CSS?

Text would go above it.

Instead of an underline I would put that. So, the 3 swivels would be proportioned to the text.

I don’t follow what you mean here. If you cannot construct a better drawing, you might want to find a web page that shows what you want and make a screenshot of the design on that page. Crop out the unnecessary content and just post the image of the design.

Trying to think of an easy way to help you show what you want in a way that we will understand. :thinking:

I do not know how to draw the wavy line using just CSS. I’m sure I could figure it out, but I want to spend some time on another member’s code tonight, too, so I will beg out of this design for now. Perhaps another time if someone else has not solved this for you.

Why don’t you take some CSS courses? You have advanced ambitions. Think how good you would feel if you could create these designs yourself

3 Likes

or this:

I don’t know, too confusing.

The problem is, you’re trying to run before you can walk. It’s like taking up a musical instrument and thinking you’ll be able to play complex concert pieces by the end of the week. It doesn’t work like that; you need to learn and understand the basics before moving on to more complex things.

You’ve been given a great deal of help here already, but you seem to be more interested in just getting the effect you want, without understanding how the code works, and how to change and adapt it to give the results you want. As @ronpat has suggested, you should take time to get a good grounding in the basics. (Good news; unlike learning a musical instrument, that won’t take years of practice, just a week or two. )

Once you understand it - and are able to work with CSS which is not in-line - then it will be much easier for others to help you with more complex designs.

One place to start might be http://www.htmldog.com/guides/ - or look around the wealth of courses available on SitePoint Premium.

5 Likes

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