/    Sign up×
Community /Pin to ProfileBookmark

2 boxes?

Copy linkTweet thisAlerts:
Aug 23.2005

Okay I am designer and kind of new to both HTML and CSS. I have been learning both and I am now taking the plunge to build my site.

This is a style sheet for a box I am using:

<style type=”text/css”>
<!–
.emma {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
font-weight: bold;
font-variant: small-caps;
color: #000000;
background-color: #FFFFFF;
border: thin dotted #000000;
position: relative;
width: 800px;
}
–>
</style>

Its just a box to go around the title of my site, however I want another box that looks the same, but for the main content of my site (i.e. the body text and stuff). How is this done, as I am not sure I can have two CSS’s for boxes in one document?

to post a comment
CSS

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@Lone_ReactionAug 23.2005 — Yes you can. Since your style is a class , not id (#), you can use as many <div class="emma">Content</div> you want. You can also use a container div to hold the header, content and footer div. ?
Copy linkTweet thisAlerts:
@FashyauthorAug 24.2005 — Hiya,

Thanks for you help. I was woundering if you could tell me if there is anything wrong with this code:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>Untitled Document</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

<!--

.emma {

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 12px;

font-style: normal;

font-weight: bold;

font-variant: small-caps;

color: #FFFFFF;

background-color: #FFFFFF;

border: thin dotted #000000;

position: relative;

width: 800px;

text-align: left;

}

-->

</style>

<style type="text/css">

<!--

.emma {

color: #FF9966;

background-color: #000000;

border: thin dotted #000000;

position: relative;

width: 800px;

text-align: left;

list-style-position: inside;

list-style-type: disc;

}

-->

</style>

</head>

<body>

<CENTER>

<div class="emma">EMMA's DESIGNZ</font></div>

</p></CENTER>

<CENTER><P>

<div class="emma">

<p align="left"><img src="toptri.jpg" width="604" height="51"><BR>

<UL>

<li>TEXT</font></li>

<li>TEXT</font></li>

<li>TEXT</font></li>

<li>TEXT</font></li>

</UL>

<p align="center">MAIN CONTENT</font></p>

<p align="right"><img src="bottomtri.jpg"></p>

</div>

</CENTER>

</body>

</html>
[/quote]

I am TRYING to create a nav bar near the "Main Content" Area, but it keeps messing up ? What is the best way of doing it, it looks ribbish using a table and when I use CSS is messes up. As you can tell I am learning as I go along...
Copy linkTweet thisAlerts:
@Lone_ReactionAug 24.2005 — Erm.. your second .emma overrides some of the stuff (colors etc) in the first .emma. If you want the div to have different colors you should use another class name (or id). And why are there closing font tags everywhere? Get rid of them... lol
Copy linkTweet thisAlerts:
@JayMAug 24.2005 — For future reference you can validate your CSS [URL=http://jigsaw.w3.org/css-validator/validator-uri.html]here.[/URL]

Cheers,

Jay
×

Success!

Help @Fashy 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,
)...