Gradient background & Rounded Corners

  • Sio2yh20

    (@sio2yh20)


    13 years ago

    Hi all

    Let me first say Thank you for the help! and second – I am using a child theme. having gotten that out of the way………

    – what is the code to add a gradient background and where does it go?
    – what is the code and where does it go to create rounded corners for the body.

    I found several great articles and even a wonderful video but they dont apply to the twenty eleven.

    site: https://www.allianceaquatics.org

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter Sio2yh20

    (@sio2yh20)

    Hmmm …..

    It seems……..

    #example1 {
    -moz-border-radius: 15px;
    border-radius: 15px;
    }

    Is the way to go however I need help on implimentation.

    Thanks.

    aawas

    (@aawas)

    #roundedCorners {

    /* Border Radius Style */
    border-radius: 15px;

    /* Mozilla Firefox Extension */
    -moz-border-radius: 15px;
    }

    Thread Starter Sio2yh20

    (@sio2yh20)

    Hi aawas,

    Thanks for the reply. I went ahead and paid for some tutoring in this.

    First I decided to forgo the gradient background it just didn’t seem worthwhile. I did do the rounded corners though.

    – First we moved the nav menu: Go to header.php find and move all code from “<nav id=”access” through </nav><!– #access –>” to below <div id=”main”>. (this resolves “css overlow menu issues)

    – to get the rounded corners: find and add /change the following code to the style.css.
    (Line 327)
    #page {
    margin: 02em auto;
    max-width: 1000px;
    border-radius: 15px 15px 15px 15px;
    box-shadow: 0 0 15px; (- optional)
    padding-bottom: 15px;

    (line 505 – I think)
    #branding {

    position: relative;
    z-index: 9999;
    border-radius: 15px 15px 0 0;
    overflow: hidden;

    (line ?)
    #main {
    clear: both;
    padding: 0;

    Some of the css like box-shadow and raduis can be tailored to suit.

    Hope this helps some of you all ??

    Hi,

    I got this woring on Firefox but not Safari (nor iOS or Mac).

    What code is there missing in this that make it work in safari?

    I got round corners in the bottom bot not on the top, in safari.

    The missing line above

    (line?)
#main

    is line 688 in my style.css if it help someone.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Gradient background & Rounded Corners’ is closed to new replies.