/    Sign up×
Community /Pin to ProfileBookmark

Heh.. These books sortof over-do it sometimes…

I think it’s funny how sometimes these books seem a *little* bit too heavy into the whole external CSS thing.. Here’s an example that I made.

[b]Centering Text on the Page[/b]
In the past, one would have to place the center text markup right in the HTML, like this:

<CENTER>Hello World!</CENTER>

Well, thanks to the magic of CSS, this era is at an end. Centering text is easier than ever by using CSS. First, type in the text that you’re going to want to center.

[code]Hello World[/code]

Now, you’ll place some simple, lean HTML around this text to make it easy to interpret by your stylesheet. It makes sense to me that you’ll want to use an unordered list…

[code]
<ul>
<li>Hello World</li>
</ul>
[/code]

Now that you’ve placed the HTML on the page, it’s easy to dive into the css. Create an entry for the UL in your stylesheet.

[code]
<style type=”text/css”>
<!–
ul{

}
li{

}
–>
</style>
[/code]

within the curley braces on the page, we will place the code that will lock our text in to place!!! Look at the following code.

[code]
<style type=”text/css”>
<!–
ul{
list-style: none;
margin: 0;
padding: 0;
}
li{
float: left;
text-align: center;
width: 100%;
}
–>
</style>
[/code]

With a few simple lines of CSS, you can see now how we can flawlessly place our text in the middle of the row!!! Isn’t that great!?

dep

to post a comment
CSS

6 Comments(s)

Copy linkTweet thisAlerts:
@NogDogJan 09.2006 — Huh?

Why not just do:

CSS:
<i>
</i>.center {
text-align: center;
}


HTML
<i>
</i>&lt;p class="center"&gt;The text to be center-aligned.&lt;/p&gt;
Copy linkTweet thisAlerts:
@depauthorJan 09.2006 — It's a joke... or.. it was supposed to be something funny ?
Copy linkTweet thisAlerts:
@NogDogJan 09.2006 — It's a joke... or.. it was supposed to be something funny ?[/QUOTE]
*Zooooooooooooooooom!*

(That's the sound of it going over my head.) ?
Copy linkTweet thisAlerts:
@depauthorJan 09.2006 — nah, i'm just not very funny ?
Copy linkTweet thisAlerts:
@UbikJan 09.2006 — It's like taking out the trash by carrying the garbage can around your house three times before dropping it off at the curb. Funny.
Copy linkTweet thisAlerts:
@nadamtJan 09.2006 — I got the joke. CSS is a lot of things, but simplistic is not one of them. I wish people would stop saying otherwise.
×

Success!

Help @dep spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...