css adding breaks

OK, so I'm moving from tables to css thanks to suggestions. One thing
I don't understand is that when I do a link like:

I get a break. For instance the text won't stay
in one sentence, the next words after the link drops down into a new
paragraph.

Any idea how to stop that?

css also seems to make it tough to break as you want. For instance








instead of giving me:

text
text
text

gives me :

text text text

I can't seem to control breaks while using css

Dave

Re: css adding breaks

..oO(iamdave)

>OK, so I'm moving from tables to css thanks to suggestions. One thing
>I don't understand is that when I do a link like:
>
> I get a break. For instance the text won't stay
>in one sentence, the next words after the link drops down into a new
>paragraph.
>
>Any idea how to stop that?

It's something else in your code, so please post a URL.

>css also seems to make it tough to break as you want. For instance
>
>

>

>

>
>instead of giving me:
>
>text
>text
>text
>
>gives me :
>
>text text text
>
>I can't seem to control breaks while using css

Same thing - code error. Post a URL.

Micha

Re: css adding breaks

On Jan 18, 11:57 am, Michael Fesser wrote:
> .oO(iamdave)

> It's something else in your code, so please post a URL.
>
>
> Micha

Haven't published it. Here's the page code.

TR/html4/strict.dtd">

Re: css adding breaks

..oO(iamdave)

>On Jan 18, 11:57 am, Michael Fesser wrote:
>> .oO(iamdave)
>
>> It's something else in your code, so please post a URL.
>
>Haven't published it. Here's the page code.

Nest time please get some webspace or use the one of your ISP to upload
a test case. Don't expect people to copy and paste your code onto their
own machines.

>body{font: 76% arial,sans-serif}

76% will be way too small for many people, but the main problem ...

>a{display:block;color: #981793;padding:10px}

.... is this. Remove the 'display: block'.

>The bottom footer is the where problem #1 arises. Problem #2 was on
>the left side nav. But I seem to be able to get around that by
>restricting the width of that column.

For a navigation bar using an unordered list would make more sense.

Micha

Re: css adding breaks

On Jan 18, 12:32 pm, Michael Fesser wrote:
> .oO(iamdave)
>

> Nest time please get some webspace or use the one of your ISP to upload
> a test case. Don't expect people to copy and paste your code onto their
> own machines.

Sorry, my fault. I posted it now. It was just goofy looking and I was
ashamed to have it up there. It's live now at http://the316band.com

> >body{font: 76% arial,sans-serif}
>
> 76% will be way too small for many people

I'm the novice with css and got this template from somewhere on the
net to get started using css instead of tables. Not sure even what 76%
is. I increased it to 90% though figuring it needed to be higher.

> , but the main problem ...
>
> >a{display:block;color: #981793;padding:10px}
>
> ... is this. Remove the 'display: block'.
>
> >The bottom footer is the where problem #1 arises. Problem #2 was on
> >the left side nav. But I seem to be able to get around that by
> >restricting the width of that column.

thank you much!

> For a navigation bar using an unordered list would make more sense.
>
> Micha

I'll look into that and learn about that also. :-)

If I may, a couple new questions from a rookie.

- In Firefox I get a little red line under my links at the bottom of
the page in the footer section. any way to get rid of those?

- In both IE and firefox an extra space is created directly before and
after every hyperlink. Nothing I do seems to move the "extra" space. I
tried deleting any space which didn't change anything. Still 2 spaces
before and after hyperlinks.

- For some reason in IE sometimes hovering over a link doesn't give
you the url or little hand showing you it's a hyperlink. But you go
back to it again it finally will. I see this especially in the footer
section. It just doesn't seem to like the links very well for some
reason.

I ordered 2 books on css so I can gain some more insight into this. My
next step is to make a file so that I don't have to call the css files
on every page. I forget what they call that but realize how useful it
will be for the entire site to look much better and be easier to
maintain.

Thanks again, I certainly appreciate your help.

Dave

Re: css adding breaks

iamdave wrote:

> Michael Fesser wrote:
>> .oO(iamdave)
>>> body{font: 76% arial,sans-serif}
>>
>> 76% will be way too small for many people
>
> I'm the novice with css and got this template from somewhere on the
> net to get started using css instead of tables. Not sure even what
> 76% is. I increased it to 90% though figuring it needed to be higher.

The percentage is the .. percentage .. of your visitors chosen default
font size. 90% is only 90% of my chosen size. Or yours. Or BillyBob's.
See this page of mine, which may help in understanding:
http://k75s.home.att.net/fontsize.html

If 100% looks too large in *your* browsers, decrease your own default by
a little bit.

I'd also recommend you not use pixel (px) sizing for anything but sizes
of images, and borders 'round stuff. Use em units instead. This way,
when the visitor with vision problems comes by and increases the size to
something s/he can read, your content doesn't escape outside your
constrained limits.

> I ordered 2 books on css so I can gain some more insight into this. My
> next step is to make a file so that I don't have to call the css
> files on every page. I forget what they call that but realize how
> useful it will be for the entire site to look much better and be
> easier to maintain.

I'd call it using "external css" rather than "inpage..." ;-)

While you wait for your books, have a play here:
http://htmldog.com/

You have HTML errors on your page:


--
-bts
-Motorcycles defy gravity; cars just suck

Re: css adding breaks

iamdave wrote:
> On Jan 18, 12:32 pm, Michael Fesser wrote:

>
> Sorry, my fault. I posted it now. It was just goofy looking and I was
> ashamed to have it up there. It's live now at http://the316band.com/
>
>>> body{font: 76% arial,sans-serif}
>> 76% will be way too small for many people
>
> I'm the novice with css and got this template from somewhere on the
> net to get started using css instead of tables. Not sure even what 76%
> is. I increased it to 90% though figuring it needed to be higher.

You were right, but the number is 100%. 90% might be okay for your
copyright text, though.


>
>> For a navigation bar using an unordered list would make more sense.
>>
>
> I'll look into that and learn about that also. :-)
>
> If I may, a couple new questions from a rookie.
>
> - In Firefox I get a little red line under my links at the bottom of
> the page in the footer section. any way to get rid of those?

The line is there because that's how browsers typically display links.
The underlines are also how people recognise where the links are. Since
you're talking about a menu, it might not confuse anybody to remove the
underlines, but I wouldn't suggest you do it otherwise.

To your a rule you could add the declaration "text-decoration:none;"
(without quotes). But this will affect the other links on your page,
such as those in the sidebar. So consider making a separate ruleset

..footer a { color:#FFFFFF; text-decoration:none; }

to come after your .footer and a rule sets.

Then you can (and should) take all the declaraions out of the markup.

>
> - In both IE and firefox an extra space is created directly before and
> after every hyperlink. Nothing I do seems to move the "extra" space. I
> tried deleting any space which didn't change anything. Still 2 spaces
> before and after hyperlinks.

That'll be the padding:10px; in your CSS for a. Delete that. It'll be:
a {color:#981793; }

This will also clear up the problem I see in FF where only part of the
link is underlined.

>
> - For some reason in IE sometimes hovering over a link doesn't give
> you the url or little hand showing you it's a hyperlink. But you go
> back to it again it finally will. I see this especially in the footer
> section. It just doesn't seem to like the links very well for some
> reason.

I don't know (although I see that too), but maybe it's because your
footer links are inside a

which has a line-height declared. What
happens when you remove that declaration from the p rule, or you change
the links from

contents to

list items as Michael suggested?

May I also suggest you consolidate your declations for one element to a
single rule set? So instead of two rules for .footer you get
div#footer {background:#333; color:#FFF; clear:left; width:100%; }.

I also suggest you declare color where you specify background-color, and
vice-versa.



--
John
Read about the UIP: http://improve-usenet.org/