Done! Finally. My blog is styled, by website is running (www.stonefest08.host56.com) and I can now do those other things I need to do. Graphic design for a start.
For my blog design, I wanted to do something really simple yet bold. I decided on the final one after a few trial designs. The first one included a banner for each type of post, that wrapped around the content section. I decided against this, when I realised that my styling would be too complex for me to create on the back of an existing blog theme.
The style changed a few times until I decided I liked this one, and the icons for each post is what I kept from the original design.
The most annoying part of the styling was changing the properties of some of the elemets, most noteably the permalinks and the quote source. I still haven’t enitrely worked them out, but I have changed them enough to make me happy.
All in all, I found this unit quite fun. I know I grumbled a lot, but the problem solving and the trial and error I found challenging. I definately feel more comfortable with web design than when I started, and I hope that I can pull through the next time I have to make one.
So thanks to all for all the help!
Big love, rmcd
2 years ago
I had a bit of trouble last night regarding positioning my logo above the content box. I had used the margin: auto; function to position the content box in the middle of the page, and it would move smootly as I resized the page. This used relative positioning, and everything was fine and dandy.
But then I had to position my logo on top of the content box. Ok, I thought, just use z-indexing. Ths had been my plan for a while (I changed the layout of my page, so it didn’t have any rounded corners. It saved a hell of a lot of messing around and helped me better understand css). But I didn’t realise that z-indexing wouldn’t work with relatve positioning: it needed absolute.
This worked, except when I tried resizing the window, the logo sayed in the same position whilst the box moved freely underneath.
Despite trying again and again to make it work with no success, I started searching the internet for ways to make a z-index work using relative positioning. I couldn”t find an answer anywhere. I almost gave up, and decided to approach the logo from a different perspective, until I had a brainwave: Instead of trying to use a z-index with relative positioning, could I instead use a box with absolute positioning?
All I would have to do then was to find a way to make an absolute positioned object centered on the page, regardless of the window size. Success! A simple Google search got me what I wanted. The css is pretty simple:
#content {
width: (value)px;
position: absolute;
left: 50%;
margin-left: -(value/2)px;
}
The position: absolute would allow the two elements to use a z-index. The left: 50% placed the content 50% of the way acros the screen, and the margin-left value was negative half of the width, placing the content in the middle of the screen.
I might be crude, but I thought it solved my problem quickly and efficiently. Thanks to www.zachgraeve.com for the help! If this hadn’t worked, I would most likely still be working on the logo positioning.
2 years ago
I have seen Google custom searches on various sites, and I hadn’t really used one. My experience with them wasn’t good, mostly because it didn’t return results that I wanted, or was just confusing and hard to understand.
Looking at the Google custom search website, it becomes apparent that it is completely customisable. (The only exception is that to use one for free you have to have the advertising). You can do all sorts of stuff, including blocking sites, refining searches based on keywords, cutomise colours and so on.
I don’t think people use this tool to their full advantage, but seeing as about 66% of websites don’t even have a search function (and should) I suppose it’s not too bad.
I would like to use one, but I don’t want to spend too much time setting it up, and leaving the other more important work until the last minute. I’ll see how things go.
Ciao!
2 years ago