سؤال

Text-align:justify doesn't seem to space out hyperlinks the way it spaces out regular text. This means that if I use no hyperlinks, the text looks fine with no awkward spaces, but if I add hyperlinks, new awkward white spaces are required to fill the gaps left by the un-spaced-out hyperlink text. Is there any way to fix this? You can see what I mean by checking out what I have so far here: www.laborcrib.com (awkward gaps around the hyperlinks)

This is the only styling for my text:

    article {
    font-size: 19px;
    max-width: 650px;
    margin: 0 auto;
    font-family: 'Open Sans', sans-serif;
    padding: 20px;
    line-height:33px;   
    text-align: justify;
    color: #383737;
}

[This is only my second post so let me know if there's anything I can do to improve this question--I've searched for similar questions and I've tried to be as specific as possible]

هل كانت مفيدة؟

المحلول

You have a style that is adding a {padding: 0px 28px 0px 28px;} for your links in the <style> section in the <head> of index.html. Look for line 49 of index.html.

It may be possible that this was intended to be scoped to some other a tags (perhaps navigation?), but it is applying to all of them.

In addition your normalize.css isn't loading as it is getting a 404 not found error.

If you wanted to keep that spacing for the three links at the top below the title you could add either a class or an id to the <div> that encloses them and modify the rule so that it applied to only those three links. e.g. <div class="toplinks">... and .toplinks a { padding...

نصائح أخرى

If you remove the 28px right and left padding from the anchor element I think the anchor tag text is consistently justified with the rest of the text (at least in Chrome & IE 10). There are a couple of places where anchor tags could use a single space before it - "the website" and "nabbed their first grammy" links in particular, but those aren't CSS issues.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top