[How good is Dreamweaver BrowserLab for previewing web pages?]

Thanks Wickham and Eddie. I'll check out the sites mentioned.

[How good is Dreamweaver BrowserLab for previewing web pages?]

Hi

 

I've been testing my little site offline on IE9, Chrome and Firefox and it works ok. How best do I test it across other versions of IE, mac browsers etc before uploading it?

 

I use Dreamweaver so have BrowserLab installed but I'm not sure if this is a good product or whether I should be looking at a 3rd party product,or downloading the MSN virtual pc along with the various browsers.

 

I'd be interested to hear the thoughts of those with a lot more experience of this sort of thing than me!

 

Thanks.

[Newbie having a problem with Lightbox2!]

Thanks, Eddie. I'm hoping to get a hosting service sorted out over the next few days so will see if I can upload the 'site'.

[Best way to underline a single word?]

Thanks for getting back to me, Wickham. I see what you are saying. I didn't know that you could add two classes, providing they are not id's so thanks again!

[Newbie having a problem with Lightbox2!]

Just make sure the path are correct. Out of the box the folder setup is like this:

 

 

Thanks for your post.

 

I've checked everything against your post, and have all the folders with all the appropriate files in place.

 

Does my html look correct? Any other thoughts as to what I could be doing wrong?

[Best way to underline a single word?]

Thanks, Wickham. I'll try out what you've suggested.

 

I've just realised that you may have answered the question I asked J Stern, ie how do I attach two styles. How does a class of "here" work when there are two styles (here:link and here:hover), is it to do with pseudo classes ... I'm probably talking complete tosh here!!

[Best way to underline a single word?]

try wrapping it in a span tag?

 

html:

<p>You can download a joining form <span class = "span_underline"><a class="here" href="../text/joining.doc">here</a></span>.</p>

 

css:

.span_underline {

text-decoration: underline;

}

 

 

Thanks for your post. I'll try your suggestions. I have to admit, I haven't quite got my head around span yet!

 

---edit---

or a better solution, dont add span class at all and "text-decoration: underline;" to your .here class in the css file

 

Do you mean that I should create another style called .here - if so, how do I attached 2 styles? I tried attaching "text-decoration:underline" to my .here:hover style but it only shows when you hover over it and I wanted it showing all the time.

 

[Best way to underline a single word?]

I've set up a 'Join Us' page on a test site. The sentence 'You can download a joining form here' has a hyperlink attached to the word 'here' so that a Word file can be downloaded.

 

The word 'here' already has a style applied to it so that it changes colour if you hover over it:

 

.here:hover	{ color:#00F;	}

 

However, I also want the word to be permanently underlined, so have done the following within html, but it feels a bit clunky. Is there any other way of achieving the same result without putting it in the html?

 

<p>You can download a joining form <a class="here" style="text-decoration:underline" href="../text/joining.doc">here</a>.</p>

[Newbie having a problem with Lightbox2!]

Not from what I can see which is why I asked if you could upload this to a site so we can see what's going on. More than likely it's probably got to do with file paths maybe for the scripts. I don't know for sure until I can see what you have.

 

Hi, sorry I forgot to answer that bit of your post! I'm only just in the process of setting up a hosting service etc so don't have anywhere to load anything at the moment.

 

All I have done is set up a test 'site' of one page to see if I could get the script to run. What you see in the html is pretty much all there is, apart from the various Lightbox files.

[Newbie having a problem with Lightbox2!]

I don't suppose you have this uploaded somewhere for us to look at?

 

The only thing I see at the moment is that you don't have a doctype at the top of your html page.

 

 

Thanks for your post, Eddie. I do have doctype, etc at the top, just didn't include it:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

 

Can you see anything obviously wrong with what I've done?

[Newbie having a problem with Lightbox2!]

I've set up a test site with just Lightbox2 on it, and gone through the How to step by step(http://lokeshdhakar.com/projects/lightbox2/#how). I set up folders for css and js with all the relevant files in them. These files are showing at the top of my html file and can be opened so I'm assuming that these are all ok. I also set up an images folder which contains the buttons, images etc. lightbox.css is showing a couple of Netscape 8.0 errors, but I don't believe that's relevant. The thumbnails are showing but when I click them in IE9, Firefox etc, nothing happens.

 

Here's the html:

 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Lightbox Test</title>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link href="css/lightbox.css" rel="stylesheet"  type="text/css" media="screen" />
</head>

<body>
<p>Single images:</p>
<a href="images/1_b.jpg" rel="lightbox" title="Glasses"><img src="images/1_s.jpg" /></a>
<a href="images/2_b.jpg" rel="lightbox" title="Glasses"><img src="images/2_s.jpg" /></a>
<br />
<br />
<p>Gallery of Images:</p>
<a href="images/1_b.jpg" rel="lightbox[Group1]"><img src="images/1_s.jpg" /></a>
<a href="images/2_b.jpg" rel="lightbox[Group1]"><img src="images/2_s.jpg" /></a>
<a href="images/3_b.jpg" rel="lightbox[Group1]"><img src="images/3_s.jpg" /></a>
</body>

 

 

lightbox.js appears to be referencing the images folder correctly:

LightboxOptions = Object.extend({
fileLoadingImage: 'images/loading.gif', 
fileBottomNavCloseImage: 'images/closelabel.gif',

 

 

lightbox.css as the following lines in it, but I'm not sure if they are referencing my local images folder:

#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }

#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

 

I wondered if everything had to be in a lightbox folder, so I set up another test to try that, but had the same results. Any idea as to what I am doing wrong and how to rectify it?

 

Look forward to hearing from someone.

 

Many thanks.

[Template for structure, comments etc re CSS]

Thanks again, Wickham. Seeing how you've handled the comments is particularly useful.

[Template for structure, comments etc re CSS]

It's often recommended to start with reset styles like all those shown in Meyer's reset:-

http://meyerweb.com/eric/tools/css/reset/

Copy those to the top of your stylesheet and it will make all browsers work the same way, getting rid of their different default margins, padding, etc.

 

Themn you will have to code the styles for your page. As you have made all margins and padding 0 using the reset, you will have to add back margins and padding where you want them. I normally start with the body, then all the h1 to h6 and p tags, then the divs, ul tags and other main elements including working from the top of the page with header, navbar, content and footer, then link styles and special menu styles, perhaps for a dropdown menu.

 

Thanks for your post Wickham. I've got the reset in there, and have made a note of the various 'sections' you've mentioned.

 

I would be really interested to see what a few completed stylesheets look like in terms of the comments people have made on the sheet to help them in future, whether they've used /*Headings*/ etc for the different sections and wotnot. I've looked online for templates and such like, but don't come up with a great deal.

[Template for structure, comments etc re CSS]

Hi

 

I would like to put together a template for a stylesheet that I can use as a starting point again and again to ensure that I cover everyting. I'm thinking of headings, structure/order etc., along with what type of comments are helpful, where people place the comments.

 

If anyone has any thoughts on this, or perhaps a stylesheet that wouldn't mind sharing which illustrates the kind of things I need to think about, I would really appreciate it.

 

Thank you.

[Creating multiple galleries on one page]

Hi

 

I'm new to web design, and have used this site and one or two others for advice, so decided to join.

 

I am putting together a fairly simple website containing just a few pages, ie Home, About, Gallery and Contact. I would like the Gallery page to have thumbnails which, when clicked on, go through to a lightbox. I can just about do this using some online tutorials, books etc.

 

However, because there are going to be loads of images, I want the Gallery page to have 'links' (may not be the correct term) to other galleries. I can't quite get my head around how to do this, so I'm looking for advice and guidance. I've had a look online but, as yet, I can't find any examples which illustrate the kind of thing I like.

 

Any help would be much appreciated.

 

Thank you.