PDA

View Full Version : Completely CSS3 Layout



Invent
18-11-2007, 10:29 PM
Hi,

I got bored, so I decided to try and make a layout completely using CSS3.

The layout only works in Firefox well, so yeah.

http://invent.no-ip.org/sig/

It looks terrible, but still :D!

-Simon

Dentafrice,
18-11-2007, 10:32 PM
Wow, i like it for being CSS :]

Invent
18-11-2007, 10:33 PM
^_^ Thanks.

L!nK.
18-11-2007, 10:36 PM
It's abit messy but looking good though


messy good

Invent
18-11-2007, 10:43 PM
The layout now works in IE, it's just not rounded :)!

Florx
18-11-2007, 10:46 PM
Not rounded on the PSP either. Looks good though. :)

adamFTW
19-11-2007, 12:43 AM
What the hell is CSS3?

Dentafrice,
19-11-2007, 12:49 AM
http://www.css3.info/
http://en.wikipedia.org/wiki/CSS3

abnormal
19-11-2007, 02:23 AM
Oooh!
Not bad for CSS. :D

Florx
19-11-2007, 05:05 PM
How does this make it go rounded?
Ahhh the border-radius thing :) nice

element.style {
-moz-border-radius-bottomleft:0.3em;
-moz-border-radius-bottomright:0.3em;
-moz-border-radius-topleft:0.3em;
-moz-border-radius-topright:0.3em;
border-bottom-color:#E5E5E5;
border-bottom-style:solid;
border-bottom-width:1px;
border-left-color:#E5E5E5;
border-left-style:solid;
border-left-width:1px;
border-right-color:#E5E5E5;
border-right-style:solid;
border-right-width:1px;
border-top-color:#E5E5E5;
border-top-style:solid;
border-top-width:1px;
font-family:Tahoma;
font-size:11px;
height:298px;
padding-bottom:0px;
padding-left:0px;
padding-right:0px;
padding-top:0px;
}

iTechnical
19-11-2007, 05:14 PM
v. nice css!

craigg.
19-11-2007, 06:16 PM
I dont understand how people say "It's fully CSS", It's not. You have to include HTML or some other language to use/display the CSS. But anyway, nice coding.. I guess it could be cleaned up alot, but it's good to see people expanding their knowledge.

Invent
19-11-2007, 06:21 PM
I'm saying I designed the layout completely using CSS3 and no images were used.

redtom
19-11-2007, 06:22 PM
Why don't you use a style sheet? Or is that some gay CSS3 rule.

Invent
19-11-2007, 06:27 PM
Why don't you use a style sheet? Or is that some gay CSS3 rule.

I couldn't be bothered making a seperate file ;) lol

iTechnical
19-11-2007, 06:32 PM
I couldn't be bothered making a seperate file ;) lol

lol ^^

Don't always have to make style sheets you know. O.o
As above, could do with some cleaning up, but very nice.

redtom
19-11-2007, 06:38 PM
I couldn't be bothered making a seperate file ;) lol

Lol lazy git, although use % instead of px, that way it fits for diffrent resolutions and small windows,


Looks pritty good in FF, same we've got to wait ages before IE pulls there finger out

Invent
19-11-2007, 06:43 PM
Lol lazy git, although use % instead of px, that way it fits for diffrent resolutions and small windows, looks pritty good in FF.

Same we've got to wait ages before IE pulls there finger outYeah. It's quite suprising how Microsoft are still so far behind with their Trident engine where as with Mozilla they are basically competing with Webkit (Apple) to try and provide the best CSS possible, lol.

Blob
19-11-2007, 07:04 PM
Firefox is just, the best. IE 7 always crashes when I try to close it when I open it on mistake.

Jaysir
19-11-2007, 07:27 PM
I like it. Good Job! +Rep

iTechnical
19-11-2007, 07:59 PM
Meh, I use FF now.
Ie sucks.

Beau
19-11-2007, 08:39 PM
When are the other browsers set to support CS3?

DeejayMachoo$
19-11-2007, 08:46 PM
Its less of that but more of when are people going to upgrade the brower.. i know people that use ie 6 and 5

QuickScriptz
20-11-2007, 12:22 AM
I got bored, so I decided to try and make a layout completely using CSS3.


Okay, well I just have to take issue with this. It seems that you have failed to make a layout completely using CSS3 because you used the following:

-HTML Tags; <div>, <body>, <html>, <title>, <head>, <meta>, <strong>, <br />, <!-- -->, <style>
-DocType Declaration
-Images

Theres more... I'm just too lazy to go through it all :P

Beau
20-11-2007, 06:53 AM
Okay, well I just have to take issue with this. It seems that you have failed to make a layout completely using CSS3 because you used the following:

-HTML Tags; <div>, <body>, <html>, <title>, <head>, <meta>, <strong>, <br />, <!-- -->, <style>
-DocType Declaration
-Images

Theres more... I'm just too lazy to go through it all :P

... When someone says 'layout completely done with CSS', how do you think they're doing it? You can't make a site with raw CSS alone, and if you think you can, I'd like to see it.

:Kyle
20-11-2007, 07:02 AM
good..for a beginner
sorry just had to say it, been saying it all this week

i think it's really good.

--ss--
20-11-2007, 04:05 PM
Wow that's awesome , never thought it was possible to make a layout like that without using any images at all :O
Do you mind if i view the source and play around with the codes as I would like to learn how you did it

Invent
20-11-2007, 04:07 PM
Sure :)

craigg.
20-11-2007, 04:13 PM
Wow that's awesome , never thought it was possible to make a layout like that without using any images at all :O

Of course it is possible, but Simon did use images. I don't think sim would use CSS to make a fancy background like that!

Edit: Needed to clarify what I meant

Aflux
20-11-2007, 04:16 PM
Of course it is possible, but Simon did use images. I don't think CSS could make a fancy background like that!
It's probably possible, in some way [not straight forward or literal].

craigg.
20-11-2007, 04:20 PM
It's probably possible, in some way [not straight forward or literal].

It is, when you think about it. It's not very practical, but it would be just as quick to use an image.

Want to hide these adverts? Register an account for free!