/    Sign up×
Community /Pin to ProfileBookmark

Why is not on page paragraph as defined in css?

Copy linkTweet thisAlerts:
Apr 16.2007

I have code on web site like:

[code=php]

<html>
<head>
<title>title1</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=windows-1252″ />
<style type=”text/css”>

#wrapper {
width: 770px;
margin: 0 auto;
text-align: left;
}
#header {
height: 100px;
width: auto;
margin: 0px;
padding: 0px;
}
/*this container holds the logo and heading graphic*/
.logo {
width: 200px;
background-color: #c7b68f;/*themecolour1;*/
}
#spacer {
width: auto;
}

/*this container holds the column content*/
#holderdiv2 {
width: 770px;
padding-right: 0px;
padding-left: 0px;
}
/*the individual text boxes in the left-hand column*/
.coldiv {
margin: 8px 0 10px;
background-color: #faf9f5;/*themecolour3;*/
color: #333333;/*themecolour3%0;*/
border: 1px solid #E6D3A8;
width: 768px;
}

/*the individual text boxes in the left-hand column – alternative style*/
.leftcoldiv2 {
margin: 10px 0;
background-color: #faf9f5;/*themecolour3;*/
width: 558px;
border: 1px solid #e6d3a8;/*themecolour1$ 4.1%, 54.6%;*/
padding: 1px;
color: #333333;/*themecolour3%0;*/
}
/*the individual text boxes in the right-hand column*/
.rightcoldiv {
margin: 10px 0;
width: 200px;
background-color: #fffcf5;/*themecolour1$ 86%, 100%;*/
border: 1px solid #c7b68f;/*themecolour1;*/
color: #333333;/*themecolour3%0;*/
}
.rightcoldiv2 {
margin: 10px 0;
width: 200px;
background-color: #faf9f5;/*themecolour3;*/
border: 1px solid #c7b68f;/*themecolour1;*/
color: #333333;/*themecolour3%0;*/
}
/*contains and positions the horizontal navbar*/
.hnav {
margin: 10px 0 0px;
width: 770px;
}

/**Redefined html tags**/
/*this defines the font style and color, also the gradient background image*/
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
text-align: center;
font-size: 100%;
background-repeat: repeat-x;
padding-top: 20px;
padding-bottom: 20px;
background-color: #9f322d;/*themecolour4;*/
}
/*sets margins to 0*/
p {
margin-top: 0px;
margin-bottom: 0px;
}
/*style the text */
#wrapper p {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
font-size: 80%;
line-height: 1.5em;
padding-right: 20px;
padding-left: 20px;
}
/*style the heading1 text */
h1 {
font-size: 100%;
padding-top: 20px;
font-weight: bold;
padding-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 0px;
}
.coldiv h2 {
margin: 0 20 5;
background-color: #fffcf5;/*themecolour1$ 86%, 100%;*/
font-size: 90%;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #dfd2b3;/*themecolour1$ 30.1%, 43.1%;*/
padding-top: 1px;
padding-bottom: 3px;
padding-left: 5px;
padding-right: 20px;
}
.coldiv h3 {
margin: 0 20 10;
background-color: #dfd2b3;/*themecolour1$ 30.1%, 43.1%;*/
font-size: 90%;
padding: 1px 20px 3px 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e27901;/*themecolour2;*/
color: #FFFFFF;
}
.rightcoldiv h2 {
margin: 0 0 5;
background-color: #dfd2b3;/*themecolour1$ 30.1%,43.1%;*/
font-size: 90%;
padding: 3px 0px 3px 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e27901;/*themecolour2;*/
color: #ffffff;
}
.rightcoldiv h3 {
margin: 0 0 5;
background-color: #c7b68f;/*themecolour1;*/
font-size: 90%;
padding: 3px 0px 3px 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e27901;/*themecolour2;*/
color: #ffffff;
}
.rightcoldiv2 h3 {
margin: 0 0 5;
background-color: #c7b68f;/*themecolour1;*/
font-size: 90%;
padding: 3px 0px 3px 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e27901;/*themecolour2;*/
color: #ffffff;
}
.rightcoldiv2 h2 {
margin: 0 0 5;
background-color: #dfd2b3;/*themecolour1$ 30.1%,43.1%;*/
font-size: 90%;
padding: 3px 0px 3px 10px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e27901;/*themecolour2;*/
color: #ffffff;
}
/*defines the style for ordered lists (numbered) */
ol {
margin-top: 0px;
margin-bottom: 0px;
margin-left: 25px;
}
/*defines the style for unordered lists (bulleted) */
ul {
margin-top: 0px;
margin-bottom: 0px;
font-weight: normal;
padding-left: 10px;
padding-bottom: 10px;
font-size: 80%;
list-style-image: url(index_files/index_bullet.gif);
list-style-position: inside;
}
/*floats element to the left*/
.left {
float: left;
}
/*floats element to the right*/
.right {
float: right;
}
/*link styles*/
a:link {
color: #c7b68f;/*themecolour1;*/

}
a:visited {
color: #dfd2b3;/*themecolour1$ 30.1%,43.1%;*/

}
a:link:hover {
color: #e27901;/*themecolour2;*/

}
/*defines the style for horizontal dividers used in right and left-hand columns */
.divider {
border-top-width: 1px;
border-top-style: solid;
border-top-color: #6273bf;
padding-top: 4px;
padding-bottom: 4px;
}
/*style the text and define background image for the footer*/
#footer {
width: auto;
font-size: 70%;
text-align: left;
height: 24px;
margin-right: 0px;
margin-left: 0px;
padding-top: 4px;
padding-left: 22px;
vertical-align: middle;
font-weight: normal;
color: #FFFFFF;
}
/*floats image to the left of text blocks*/
.imagefloat {
float: left;
vertical-align: middle;
margin-right: 5px;
}
#clear {
height: 1px;
}
.logo1 { margin: 0px 0 10px;
width: 200px;
height: 100px;
}
/*floats logo graphic to the left */
div.row span.left {
float: left;
text-align: left;
}

/*floats heading graphic to the right */
div.row span.right {
float: right;
text-align: right;
}

/*Dodano */
#main4 h1 {
font-size: 14px;
margin: 0px 20px 5px;
padding-top: 20px;
font-weight: bold;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #cbbc99;/*themecolour1$ 30.1%, 43.1%;*/
padding-bottom: 2px;
padding-left: 0px;
}

#main4 {
width:762px;
float: left;
padding-top: 0px;
padding-right: 7px;
padding-left: 0px;
text-align: left;
font-family: Verdana, Arial, Helvetica, sans-serif;

}

#ctnL {
float: left;
width: 174px;
text-align: center;
}

#mainctnR{
width: 555px;
border-left: 1px dotted #CCCCCC;
margin-left: 174px;
text-align: left;
padding-top: 5px;
padding-right: 0px;
padding-left: 10px;
padding-bottom: 15px;

}

#mainbanner{
font-family: “Times New Roman”, Times, serif;
font-size: 2.0em;
color: #bd942a;
border-bottom-width: 2px;
border-bottom-style: solid;
border-bottom-color: #bd942a;
padding-bottom: 1px;
}

.subheading1 {
font-size: 1.3em;
font-style: normal;
color: #9F322D;
letter-spacing: -.09em;
}

.mainctnR.paragraph1{
margin:0em 0em 5em 0em;
text-indent:0em;}
–>
</style>

<link rel=”stylesheet” href=”css/imenus0.css” type=”text/css”>

</head>

<body leftmargin=”0″ topmargin=”0″>

<div id=”wrapper”>

<div id=”holderdiv2″>

<div class=”row” id=”header”><span class=”left”><img src=”images/header.jpg” width=”768″ height=”98″></span> </div>

<div class=”hnav”>

</div>

<div class=”coldiv”>

<div id=”ctnL”>
<p>Left stuff here<br><br><br></p>
<p>and here</p> <p>and here</p> <p>and here</p> <p>and here</p> <p>and here</p>
</div>

<div id=”mainctnR”>
<div id=”mainbanner”>Main page</div>

<h1 class=”subheading1″>subheading1</h1>
<p class=”paragraph1″>
this is paragraph number1, b&#269;la, bla, bla, bla.
</p>
<p class=”paragraph1″>
this is paragraph number2, b&#269;la, bla, bla, bla.
</p>

</div>

</div>
<div class=”right” id=”holderdiv”>

</div>

<div id=”clear” style=”clear: both;”></div>

<div id=”footer”>

</div>
</div>

</body>
</html>

[/code]

Need to add space between paragraphs as defined 5em in

[code=php]
.mainctnR.paragraph1{
margin:0em 0em 5em 0em;
text-indent:0em;}
[/code]

Do not understand why it does not recognise on web site this white space?

Need help

to post a comment
CSS

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@ryanbutlerApr 16.2007 — Looks like you have created an ID of mainctnR, but then used it as a class when assigning the paragraph class, therefore, you're confusing an ID with a class. Change this rule:

[CODE].mainctnR.paragraph1{
margin:0em 0em 5em 0em;
text-indent:0em;} [/CODE]

To:

[CODE]#mainctnR.paragraph1{
margin:0em 0em 5em 0em;
text-indent:0em;} [/CODE]
Copy linkTweet thisAlerts:
@toplisekauthorApr 16.2007 — thank you,

if I change to
[code=php]#mainctnR.paragraph1{
margin:0em 0em 20em 0em;
text-indent:0em;}
[/code]

it will be the same
Copy linkTweet thisAlerts:
@ryanbutlerApr 16.2007 — I thought you meant spacing between each paragraph block, but I think you mean spacing between the lines of text in a paragraph. In that case, replace margin with line-height:

[CODE]#mainctnR.paragraph1{
[B]line-height:1.5em;[/B]
text-indent:0em;}[/CODE]

If this isn't what you're after, post a sample page.
Copy linkTweet thisAlerts:
@toplisekauthorApr 16.2007 — I thought you meant spacing between each paragraph block, but I think you mean spacing between the lines of text in a paragraph. In that case, replace margin with line-height:
[/QUOTE]
I need spacing between each paragraph block. If I put your code
[code=php]

#mainctnR.paragraph1{
margin:0em 0em 20em 0em;
text-indent:0em;}

[/code]

it will not work. you can test as this is all code that I have.
Copy linkTweet thisAlerts:
@ryanbutlerApr 16.2007 — This worked for me locally:

CSS:

[CODE]#mainctnR p.content{
margin:20px 0 20px 0;
text-indent:0em;
}[/CODE]


HTML:
[CODE]<div id="mainctnR">
<div id="mainbanner">
Main page
</div>


<h1 class="subheading1">subheading1</h1>
<p class="content">
this is paragraph number1, b&#269;la, bla, bla, bla.
</p>
<p class=="content">
this is paragraph number2, b&#269;la, bla, bla, bla.
</p>

</div>[/CODE]
Copy linkTweet thisAlerts:
@CentauriApr 16.2007 — Put a space between the id name and the classname [CODE]#mainctnR .paragraph1[/CODE]

To apply to all paragraphs in #mainctnR, you don't need a class
[CODE]#mainctnR p{
margin:0em 0em 2em 0em;
text-indent:0em;} [/CODE]

Cheers

Graeme
Copy linkTweet thisAlerts:
@toplisekauthorApr 20.2007 — thank you, it works Graeme, this is great
×

Success!

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