Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Usage of <DIV>

Status
Not open for further replies.

Capoerista

Programmer
Aug 13, 2002
44
0
0
GB
I created the following webpage as an exercise to learn about CSS.


Should the images ideally go in a <DIV> rather than a <P>?
Is using classes e.g. centralbigspacing to control spacing seen as an acceptable method? I did this due to significant differences in default spacing between IE and Firefox.

Any other coments or observations would be welcome.

Thanks in advance

Adrian
 
Looks good. Paragraph is suitable for what you have there. I have no comments except that the default font is rather small.
 
Adrian,

Regarding the small font size that Vragabond mentions... Here's a recent post that shows how to get a fairly good "base" size for most browsers, around which you can set up the ssizes for your headings, and body text (if you think it needs changing).

thread215-1138653

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
wow, yes:

font-size: 6pt;

way too small even at a relativley large resolution of 800 x 600. What resolution do you use to view your pages with? I rarely go below 10 pt if using pt units of measure.
 
I wouldn't use too much sleep over whether to use a <p> or a <div> - you could make a case for either. I would give it a class name that reflected the element in question's content, rather than its presentation, class="samplepics" for example. You might redesign it one day not to be centred, or not to have big spacing - then your class name is just gonna be confusing.

You shouldn't need to give all the links in your menu [tt]class="b"[/tt]. If you want to apply styles to menu links, you can do it like this:
Code:
.menualignment a { color: gray; }
You might also consider placing those items in a <ul> (hint: style the <li>s with [tt]display:inline[/tt]).

Put the "This is a test page..." text in a seperate paragraph (<p>) element to the pictures. Because it is.

To answer the question in that paragraph, yes - you can get rid of the <hr>s, just style the <h1> to have top and bottom borders.

As a general rule of thumb, try to keep the html markup as simple and straightforward as possible. Reflect the structure of the document and the information it contains, and don't worry initially about how it will be presented. You should be able to get most of the presentation stuff from CSS, only resorting to <br>s and <hr>s if you really have to.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd
 
I meant to say a relatively "low" resolution of 800 x 600 in my above post.
 
Thanks for all your replies. I only saw the page at 800x600 on a 14" CRT yesterday and I agree that 6pt looks awful. The joys of designing for a variety of screens and resolutions. I'm running on 1280x1024.

Cheers

Adrian
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top