Confusion about CSS

User 2168940 Photo


Registered User
49 posts

Hi Everybody,

I have a really basic questions about CSS styles.

I've attached a "cssexample.gif" file to better explain myself.

The areas I've drawn are pretty much rectangular and VERY basic. Breaks any page into four separate 'geographies' that I can fill and replace as I choose. The question I have is: Do these areas always have 4 straight-line barriers, (Square or rectangular) or could I describe ??? say an oval?
(not sure why I would want an oval, or a non-linear shape. Just wondering if I can have that control over the area)

Also, If I want to introduce a fifth element, such as the "TITLE" graphic, how do I toss that into the mix, and how do I control just where it will be placed? (It would have to be 'layered-over' the other four areas)

Many, Many thanks,
-Paul-
Attachments:
User 187934 Photo


Senior Advisor
20,247 posts

Here's your oval
#oval {
width: 200px; height: 100px;
background: red;
-moz-border-radius: 100px / 50px;
-webkit-border-radius: 100px / 50px;
border-radius: 100px / 50px;
}

For the title you could use a new div that's positioned absolute with a higher z-index.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2168940 Photo


Registered User
49 posts

Outstanding!

Thank you,
-Paul-

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.