Little Boxes made of ticky-tacky…..

My professor says I’m trying to climb the whole mountain all at once in my html/css course. Interesting she should say that.  I have a really hard time with learning things from parts to whole. I really need to see the whole before I can start understanding the parts.  It’s  permaculture principle #7:  Design from Pattern to Detail.  I just haven’t seen or understood the pattern yet. It’s so complicated. I DID download an ebook that’s going to help me make sense of all of this (keep your fingers crossed).

So this week’s part is on boxes and how to add them to your web site.  Since I don’t have a whole picture yet, I can’t imagine what I might use boxes for, but I need to learn them now.  So, my boxes are random, but I’m confident I could recreate them.  I will use boxes to bring something of major importance to the attention of my reader/browser/lurker.  You can see that both of those boxes would work for bringing something into focus.  The second one with its own background is better.  Screen Shot 2014-11-06 at 12.24.49 PM

I spent way too much time down various rabbit holes this week again because of all the cool stuff there is to check out on our syllabus.  One of the things I thought was SO COOL was the CSS3menu.  Turns out it’s a program that is not authorized to be used on my computer, so I learned how to authorize it.  I added it to my web page and it is NOT working.  I tried many different things to make it work.  At the moment it looks like this:   Screen Shot 2014-11-06 at 12.16.21 PM
It’s so maddening because on MY computer screen I see what is below.   So I may have to delete it and just make my own box with tabs.  That’s what I get for trying to be fancy, right?  At the time of print, I did not have time to go back and mess with it. 
Screen Shot 2014-11-05 at 4.14.31 PM 

One thing I want to remember is that when I’m doing a <style> entry, I can do it at the top with all the other CSS stuff, but if I’m doing a <div> I can put the style right with the <div>.  I didn’t know that before.  Or I forgot it.   I do like how you can see different boundaries for different paragraphs by naming them p.one, p.two, and then just telling the engine to go find the information for that paragraph.

That was my problem with the rounded corner box.  I couldn’t get it to listen to me!  It kept taking the directions for p.one instead of p.two.  I had it curved, but then I wanted it to be a different color than p.one’s grey.  When I changed it to red, it wouldn’t be rounded anymore.  I’ve got to move on and not care at this point.  😦

I also attempted to put little stars in front of my list of classes.  No matter what it wouldn’t work.  I tried linking it directly, I tried url and also src prefixes, but nothing.  I must be missing a colon—which sometimes happens because I may need better bifocals!  🙂


I have yet to figure out if this really works in Word Press.  I should try it.    Of course I would need to upload the pix, but it really didn’t work.  I took about 30 min. to cruise around to see if I could find something like a place to add CSS or any specialized code things, and didn’t.  Most importantly, the boxes didn’t come out.  So, of course, I’m wondering why I am doing this if Word Press doesn’t understand my CSS stuff.  Maybe that part is coming up next week:  How to transfer all of this to a word press site, because we can’t just keep our stuff on the University server for ever, right? Screen Shot 2014-11-06 at 1.26.42 PM

So, I’ve been looking at other sites.  One that I really like is from a friend.  I asked her if she did her own site and she told me it was a template and she just plugged in the info.  Here it is:  http://www.laurapatintherapy.com/   It meets all of my criteria:  simple, nice colors, one thing to focus on, in this case it’s a quote, and scroll down for more info.  The template stays in place for all the pages and the quote is on all the pages.  But what I really like is the rotating pictures.  They aren’t her pictures, so if I could add my own, that would be awesome.

The smaller details that I love are the rounded corners, her background is simply a margin around the outside of the page.  I like how the boxes have clean white tiny borders,  there are only 3 colors and that remains the same throughout the site.  The fonts are easy to read and soft (sans serif family probably).  It’s nice because it’s simple.

So….another week. I have to quit early (it’s Thursday right now) I’m speaking at the Food Conference starting tomorrow and my power point and hand-outs are not done.

I’m thinking I’m done with trying to upload my own stuff to the server. It might have been more helpful had I figured out how to FTP to the wordpress site. I’m not sure. But…..I have to get going on the real project before my boss fires me. AND I have another grandbaby due next week–my second. So I’ll be hanging out with my favorite 2 year old Auri in Fairbanks soon and won’t have a lot of this uninterrupted time that I’ve grown to love!

Here’s a link to my page canyonartsschool.com

I’ll let you know how the FOOD CONFERENCE goes: Here’s the link!


2 comments on “Little Boxes made of ticky-tacky…..

  1. Hey there Cindee,
    looks like your styles.css file is missing. But the graphic you uploaded looks Great!
    Janene McMahan

  2. I once went hiking where I forgot to bring enough water. You’re not alone in the trying to climb the whole hill. Let’s lace up our boots together!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: