Author |
Message |
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 17 Apr 2006 06:52:21 pm Post subject: |
|
|
I'll upload the moment my own site is using it. I decided I like the layout. I'll need two weeks to get that finished though. |
|
Back to top |
|
|
Tiberious726
Advanced Member
Joined: 07 Oct 2005 Posts: 284
|
Posted: 18 Apr 2006 11:58:11 am Post subject: |
|
|
you might want to consider external sheets; it makes it easer not haveing to retype/not being boged down in extra text/loads faster on dialup because it only has to load the sheet once
other than that good job |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 18 Apr 2006 04:28:17 pm Post subject: |
|
|
I plan on putting it on an external sheet when I put it online, it was just convineint to be able to edit all parts in one window when I was coding it. I can't find where I read how to define the colors of links when held down and held over. I want to make the link turn the same color as the border around it with cursor on top.
Last edited by Guest on 18 Apr 2006 04:33:37 pm; edited 1 time in total |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 18 Apr 2006 09:26:00 pm Post subject: |
|
|
Sorry about the double post but how do I get the hover color to fill the entire cell?
<html>
<head>
<style type="text/css">
p.single {border-style: solid;text-align: center;border-width: 1px;border-color: #9999FF;background-color: #99FFFF}
p.singleleft {border-style: solid;background-color: cyan;text-align: left;border-width: 1px;border-color: #9999FF;color: #444499}
body {background-color: #99CCFF}
h4 {letter-spacing: 0.5cm;text-align: center}
table.dotted {border-width: 1px;border-style: solid;color: #444499;border-color: #99FFFF}
td.link {border-with: 1px;border-style: solid;border-color: #99FFFF}
a:hover {background-color: #99FFFF}
a:link {color: #444499}
</style>
<title>title</title>
</head>
<body>
<h4><p class="single">WEBSITE TITLE</p></h4>
<p class="singleleft">
<table width="100%" class="dotted" border="0"><tr>
<td align="center" class="link"><a href="a">link</a></td>
<td align="center" class="link"><a href="a">link</a></td>
<td align="center" class="link"><a href="a">link</a></td>
<td align="center" class="link"><a href="a">link</a></td>
<td align="center" class="link"><a href="a">link</a></td>
<td align="center" class="link"><a href="a">link</a></td>
</table>
<br>
Here goes site text, hope it is ok so far, cause I don't know, I have to type all of this just to test it. Whistle.
Ok whatever... I just like cheese. Sew me... is liking cheese that much of a problem. Whatever, I dont really
mind. If you think that it's your problem, not mine. Now I really hate to type all this text but I have to.
I want to know if my site idea would look pretty or not. Lalala... here be text. Yaryaryar. So...
how you doing? Do you find this ranting very boring? So do I. Moose. Poopy. Donald Duck. Look,
now I've sunk to putting in random words... Oh well... Cheese cheese cheese, I like cheese. Cheddar and Mushrooms.
Wait I hate mushrooms. Whoops. Oh well. Text Text Text Text. Mooselyness, king of. Googoogaagaa.
Go Brown Thunder!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! Whew!!!!!!!!!!!!!!!!!!!!!!! Ok... obviously I'm
writing random things in order to fill in space and see how the site looks. It takes a long time. Cheese.
Cheese. Cheese. Cheese.
</p>
</body>
</html> |
|
Back to top |
|
|
Weregoose Authentic INTJ
Super Elite (Last Title)
Joined: 25 Nov 2004 Posts: 3976
|
Posted: 19 Apr 2006 04:45:42 am Post subject: |
|
|
[font="courier new"]td:hover {background-color: #99FFFF}
Now, if it wasn't for Internet Explorer, it would actually be that simple.
Some browsers behave differently, while some don't behave at all. :dry:
One thing that you might've been able to do was change
the link padding to match the size of the container, but...
[font="courier new"]<rant>
I hate tables. I've reiterated this a thousand times in the channel. :D
Seriously, tables are not intended to be used as structure; they are meant for tabular data only (think spreadsheets). Progressive web developers insist on using <div> tags in the source along with style sheets outside of the source in order to make things (the layout) look pretty. Everything else becomes non-standard, unreadable, and just icky. For instance, I'm looking at a bunch of cells being used to create a list. Why not use...
[font="courier new"]<ul>
_<li>link</li>
_<li>link</li> ...A LIST!
_<li>link</li>
</ul>
...along with...
[font="courier new"]ul li {
_display: inline; Well, that was easy.
}
...and then work on formatting it from there?
CSS makes life easy. Let it do the work for you, not the HTML. ;)
[font="courier new"]</rant>
The consistent use of logic—i.e., if it's a header and not a paragraph, then get
the stinking paragraph out of the header tags!—will do much to prevent error.
Click here if you want to save some time and effort dealing with random content. ;)
Finally, as a question: Doesn't the horizontal scrollbar annoy you? Just wondering.
Last edited by Guest on 19 Apr 2006 08:49:02 am; edited 1 time in total |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 19 Apr 2006 09:01:57 pm Post subject: |
|
|
Funny, I don't get a horizontal scroll-bar. Thank you so much. That post was extremely helpful. I had not yet attempted to use a list in such a way. Thank you. |
|
Back to top |
|
|
Tiberious726
Advanced Member
Joined: 07 Oct 2005 Posts: 284
|
Posted: 20 Apr 2006 03:51:46 pm Post subject: |
|
|
Super Speler wrote: Funny, I don't get a horizontal scroll-bar.
[post="76161"]<{POST_SNAPBACK}>[/post]
that would probably be because you have a higher screen reslution; you should try to make your pages adapt to different resolutions (imagine a fixed page on a pda...) |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 20 Apr 2006 05:24:33 pm Post subject: |
|
|
What would I want to do to get rid of scroll bar. I do have it, I just hadn't noticed it. |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 12 May 2006 03:55:06 pm Post subject: |
|
|
Still practicing, here it is for now. I spent time on it so several commands may have accidently been left there from past experiments.
Code: <html>
<head>
<style type="text/css">
h2
{
border-style: solid;
text-align: center;
border-width: 1px;
border-color: #9999FF;
background-color:#99FFFF;
letter-spacing: 0.5cm;
text-align: center
}
body
{
background-color: #99CCFF
}
ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
text-align:center;
font-family: courier;
border-bottom-style: double;
border-bottom-color: #99FFFF;
}
p.text
{
background-color: cyan;
color: #444499;
border-style: double;
border-color: #99FFFF;
}
a
{
text-decoration:none;
color:#444499;
}
a.menu
{
float:left;
width:25%;
background-color:cyan;
color:#444499;
}
a:hover
{
background-color:#99FFFF
}
li
{
display:inline
}
</style>
</head>
<body>
<h2>SUPER SPELER</h2>
<ul>
<li><a href="A" class="menu">Link one</a></li>
<li><a href="A" class="menu">Link two</a></li>
<li><a href="A" class="menu">Link three</a></li>
<li><a href="A" class="menu">Link four</a></li>
</ul>
<p class="text"><br><br>
Insert text to here to your heart's content. For this is the body of the site. Here is what a link would look like: <a href="A">link</a>
</p>
</body>
</html>
|
|
Back to top |
|
|
Weregoose Authentic INTJ
Super Elite (Last Title)
Joined: 25 Nov 2004 Posts: 3976
|
Posted: 12 May 2006 04:39:25 pm Post subject: |
|
|
Nice. :)
Doesn't it feel more dynamic with the CSS in there and less styles in the body?
Though, instead of [font="courier new"]<br><br>, try something similar to: [font="courier new"]p {padding-top: 16px;}
I anticipate seeing a website of yours soon; but have a DOCTYPE to go with it!
Note that if you get more pages up that revolve around the
same layout, you should start using an external stylesheet. |
|
Back to top |
|
|
Rezek Better Than You
Calc Guru
Joined: 24 Apr 2005 Posts: 1229
|
Posted: 12 May 2006 04:52:10 pm Post subject: |
|
|
I always use <p />, is that bad? |
|
Back to top |
|
|
Weregoose Authentic INTJ
Super Elite (Last Title)
Joined: 25 Nov 2004 Posts: 3976
|
Posted: 12 May 2006 04:54:20 pm Post subject: |
|
|
I've seen it before, and it doesn't cause errors, but it's like implementing a hack.
I don't do hacks, personally. |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 12 May 2006 06:25:12 pm Post subject: |
|
|
The links are all wrong on Internet Explorer. I can't seem to figure out why... |
|
Back to top |
|
|
programmer_to_be Jesus is my Lord and Saviour.
Elite
Joined: 07 Feb 2006 Posts: 755
|
Posted: 12 May 2006 06:29:33 pm Post subject: |
|
|
What does <float: left; > do? It looks nice. I wish I could still work on my site. I deleted it all hoping to make something different of it, but now I can't. Oh well. When I take college courses, I'll probably take Web Design, Computer Science, Religion, Computer Programming, and the basic things.
Are Computer Science, Computer Apps, and Computer Programming the same? |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 20 May 2006 01:33:10 pm Post subject: |
|
|
Can I please have help, the above posted code display's the last link on a extra line in internet explorer. I still cannot figure out why. I've been trying to fix this for a really long time. |
|
Back to top |
|
|
Weregoose Authentic INTJ
Super Elite (Last Title)
Joined: 25 Nov 2004 Posts: 3976
|
Posted: 20 May 2006 01:55:31 pm Post subject: |
|
|
Sure. Add in these properties:
ul {
overflow-x: hidden;
}
a.menu {
clear: right;
} |
|
Back to top |
|
|
Super Speler Super Awesome Dude
Calc Guru
Joined: 28 Nov 2005 Posts: 1391
|
Posted: 20 May 2006 02:14:13 pm Post subject: |
|
|
Wow... um... that worked perfectly...
Weregoose is now my hero... next to all my other hero's of couse.
Thanks so much! |
|
Back to top |
|
|
Ductapemaster
Newbie
Joined: 12 Sep 2005 Posts: 41
|
Posted: 28 May 2006 02:45:05 pm Post subject: |
|
|
mmmm...IE...*shudders*. I haven't used IE in over 2 years, I hate it sooo much, but it works. Back on topic tho.
Once you learn CSS, you will fall in love with it. It makes styling pages sooo much easier. You'll never go back to using normal style commands. Also, if you are interested in something more advanced, look inot javascript. You can do so many cool things with it and its pretty easy to use. Pick up one of the "for dummies" books on Javascript (NOT the same as java, don't confuse the two...) I love that series and I own the javascript book and absolutely love it. Read the whole thing and you will know enough to make some pretty advanced stuff on your own. You can check one of the examples of Javasript (and see an example of a good webpage) here: http://lhhsstudyguides.50webs.com. The login on the front page is made in javascript, and although its not too secure, it works. You can use a temporary login to see the rest of the site:
username: temp
password: 12345
Check it out and see what you think.
Good luck, and nice job for a beginner! |
|
Back to top |
|
|
Ductapemaster
Newbie
Joined: 12 Sep 2005 Posts: 41
|
Posted: 28 May 2006 03:02:51 pm Post subject: |
|
|
ZOMG I'M DUCTAPEMASTER!1 |
|
Back to top |
|
|
Ductapemaster
Newbie
Joined: 12 Sep 2005 Posts: 41
|
Posted: 28 May 2006 03:15:13 pm Post subject: |
|
|
What the heck happened there?! Howd u do that?
(that wasn't actually me by the way)
Last edited by Guest on 28 May 2006 03:15:45 pm; edited 1 time in total |
|
Back to top |
|
|
|