The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> dd selectors
EvanC
post Feb 7 2015, 12:05 AM
Post #1





Group: Members
Posts: 7
Joined: 7-February 15
Member No.: 22,162



Hello! I have a question about external CSS and html. I need to assign the dd only with bold, italic, .090em font size and line height 200%. I don't know how to input this into my CSS file or html.


Current code:

(html first)
<dl>
<dt>What amount of mortgage do I qualify for?</dt>
<dd>The total basic monthly housing cost is normally based on 29% to 41% of your gross monthly income.</dd>
<dt>Which percentage is most often used?</dt>
<dd>The percentage used depends on the lending institution and type of financing.</dd>
<dt>How do I get started?</dt>
<dd>Contact us today to help you arrange financing for your home.</dd>
</dl>

I tried adding <div id="dd"> before the <dl> start but it did not work.

(CSS)
dd { font-size .090em;
font-style: italic, bold;
line-height: 200%; }


Thank you for looking!

ps: all my other css is working, just not this part! sad.gif

This post has been edited by EvanC: Feb 7 2015, 12:14 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Feb 7 2015, 04:24 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9



You can't have two values for font-style like that.
Try with this instead:
CODE
font: bold italic 0.9em/200% Verdana;

Change the font family to whatever font you use.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Feb 7 2015, 06:17 AM
Post #3


.
********

Group: WDG Moderators
Posts: 7,915
Joined: 10-August 06
Member No.: 7



QUOTE(EvanC @ Feb 7 2015, 06:05 AM) *

I tried adding <div id="dd"> before the <dl> start but it did not work.

That's a DIV element with the ID "dd", to select for that DIV you'd use an ID selector:

CODE
#dd {...}

or

CODE
div#dd {...}

--but if you want to use an ID you might as well give to the DL element instead:

CODE
<dl id="foo">
    <dt>...</dt>
    <dd>...</dd>
    <dt>...</dt>
    <dd>...</dd>
</dl>

and use something like this in the CSS to style all DD elements inside that particular DL:

CODE
#foo dd {...}

See also http://htmlhelp.com/reference/css/structure.html

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Feb 7 2015, 06:20 AM
Post #4


.
********

Group: WDG Moderators
Posts: 7,915
Joined: 10-August 06
Member No.: 7



QUOTE(Frederiek @ Feb 7 2015, 10:24 AM) *

You can't have two values for font-style like that.
Try with this instead:
CODE
font: bold italic 0.9em/200% Verdana;

Change the font family to whatever font you use.

I'll add that the CSS "font" property is a shorthand that combines several font-related properties into one. For details, see http://www.w3.org/TR/CSS21/fonts.html#propdef-font
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Feb 7 2015, 07:13 AM
Post #5


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 18,023
Joined: 9-August 06
Member No.: 6



And font-size 0.09em is an extremely small font size. Unless the size it refers to is humongous, that is.

In spite of everything said, some of your CSS should work. There must be something else the matter also. Can you show the whole thing, preferably link to the page? When copying snips important bits are often overlooked.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
EvanC
post Feb 7 2015, 01:20 PM
Post #6





Group: Members
Posts: 7
Joined: 7-February 15
Member No.: 22,162



Thank you for all the replies, they helped! I think I have worked out the issue. Since I am just working off my computer, I have uploaded my html and css to Google Docs and made them share-able links. Sorry if this seems novice, I just started my html class about two weeks ago.

From the design shown in my textbook, everything looks the same. There may still be errors or unnecessary tags, code, etc.

Index

Financing

Prime.css

The listing and contact page are still in the works.

Thanks again!

This post has been edited by EvanC: Feb 7 2015, 02:14 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
EvanC
post Feb 7 2015, 02:24 PM
Post #7





Group: Members
Posts: 7
Joined: 7-February 15
Member No.: 22,162



Ran my finance page through the W3C Validator and received the following errors. Although the page looks right in my browser, I still must be wrong.

Validation Output: 2 Errors

Error Line 34, Column 14: Duplicate ID dd.
<dd id="dd">The percentage used depends on the lending institution and type o…

Warning Line 32, Column 14: The first occurrence of ID dd was here.
<dd id="dd">The total basic monthly housing cost is normally based on 29% to …

Error Line 36, Column 14: Duplicate ID dd.
<dd id="dd">Contact us today to help you arrange financing for your home.</dd>

Warning Line 32, Column 14: The first occurrence of ID dd was here.
<dd id="dd">The total basic monthly housing cost is normally based on 29% to …

This post has been edited by EvanC: Feb 7 2015, 02:26 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Feb 7 2015, 03:48 PM
Post #8


WDG Member
********

Group: Root Admin
Posts: 8,279
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



QUOTE
Error Line 34, Column 14: Duplicate ID dd.
The value of the ID attribute must be unique within a given document. If you want to use the attribute for multiple elements, then you should use the CLASS attribute instead. (And you'll need to use class selectors instead of id selectors in your CSS too, of course.)
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
EvanC
post Feb 7 2015, 05:41 PM
Post #9





Group: Members
Posts: 7
Joined: 7-February 15
Member No.: 22,162



QUOTE(Darin McGrew @ Feb 7 2015, 03:48 PM) *

QUOTE
Error Line 34, Column 14: Duplicate ID dd.
The value of the ID attribute must be unique within a given document. If you want to use the attribute for multiple elements, then you should use the CLASS attribute instead. (And you'll need to use class selectors instead of id selectors in your CSS too, of course.)


Thank you, passed validation now. smile.gif

This post has been edited by EvanC: Feb 7 2015, 05:41 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 15th October 2018 - 10:23 AM