[web] Button problems and Ignorance

Started by
4 comments, last by evita 13 years, 5 months ago
So a quick measure of my skill. Before CSS I was pretty good at website design. Quit for around 6 years, and now due to necessity and desire I'm back into it.

I know the people starting it, and they are going to get professional web design services in a few weeks...but they need a temp site. Since I'm free and trying to help them out as best I can, which sadly isn't a great deal of help, I have run into a road block. I want to get better again, and help these guys out at the same time.

http://www.jouissancefestival.com is what I have been working on since 4pm yesterday. Starting from 100% scratch, and my general knowledge I think it's passable. In the grand scheme of things, it's a very rough draft.

I can provide the files if required, but for the time being all CSS styling is copied on to each page header.

Basically the two issues I'm having trouble with is getting the 'News' part of the home page to look like the picture on the homepage above, without having the actual picture be the news. Secondly, the navigation buttons up at the top have a border outline of blue(active:purple) in all browsers I test except chrome, live server and in Dreamweaver preview. I can't figure out why this is.

Any and all help would be amazing.
Advertisement
CSS Borders are what you want I think. border-style:none on those button images will get rid of the blue, and you can use the top and bottom borders on your news div to draw the orange lines. Float:right the image in the news, which will make the text go around it (or did you want two actual columns in there?
--- krez ([email="krez_AT_optonline_DOT_net"]krez_AT_optonline_DOT_net[/email])
Two columns, then for longer posts two columns that go into one large paragraph.

I'm just failing at getting the formatting down, real pita.
So I fixed the border problem, now I'm having trouble properly formatting it. If anyone is curious I made a class:

.nobo {border:0px;}

Then made each of my images . If anyone can help out with the formatting, that would be stellar.

[Edited by - evita on November 13, 2010 10:06:14 PM]
Did you check out the page I linked to?

The DIV you put the news in should have a style similar to: "border-top-style: solid; border-bottom-style: solid; border-left-style: none: border-right-style: none; border-color: #FFaa00;" This will make no side borders, but a top and bottom orange border. You probably want to mess with the thickness, color, margins etc.

The IMG should have a style with "float: right;" in it. This will make the picture off to the right, and the text will be to the left of it, until the text gets to the bottom of the picture, then it will flow under it too.
blah blah blah +-------+blah blah blah |       |blah blah blah |  IMG  |blah blah blah |       |blah blah blah +-------+blah blah blah blah blahblah blah blah blah blahblah blah blah blah blah


Or maybe I misunderstand you?
--- krez ([email="krez_AT_optonline_DOT_net"]krez_AT_optonline_DOT_net[/email])
Perfect, thank you. I misunderstood myself and it works like a dream now.

This topic is closed to new replies.

Advertisement