WordPress.org

Ready to get started?Download WordPress

Forums

Beginner's design problems (10 posts)

  1. erez_moledet
    Member
    Posted 1 year ago #

    Hello,

    I am working on my first website. http://www.buy-and-benefit.com/

    There are a few problems I can't solve by myself:
    1. I want to change the design of the blocks so that the background color will chage according to the current page e.g. when the website is loaded with the homepage on, the block with the word HOME will be with a different color. what must be changed so that ii will change?

    2. I want the blocks to have no gaps between them. how do I change that?

    3. how do i add a line that will have the same color as the current webpage (like the nenu in
    http://extension.missouri.edu/main/DisplayCategory.aspx?C=2
    4. Why is there such a significant difference inpages loading time between my website and the other one?

    5. Text design: I want the website font will be "Arial" and that the first letter of the first word in every paragraph will be in :Times New Roman", font weight = bold, and that the letter will be slightly larger. my attempt failed. I get the first letter in the first line, and the rest of the word in the line below. Why?

    I appreciate your help! Thanks,

    Erez

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    1. Are you generating the navigation (links such as HOME, HANDS ON, etc.) or are you using static HTML?
    2. You can add the CSS

    .nav li {
     margin-left: 0;
    }

    3. If you want a line underneath the navigation menu (links such as Home), you can add this CSS;

    .nav ul {
     border-bottom: 5px solid #yourColour;
    }
    
    .nav ul li a {
     display: block;
     /* Just because there is a gap when the anchor tag is left inline */
     /* Below are styles to counter extra spacing created from display: block; */
     padding: 0;
    }

    4. What is the other website?

    5. It's difficult to set fonts because you've used in-line CSS. You can apply styling to the first letter using the CSS pseudo class http://www.w3schools.com/cssref/sel_firstletter.asp .

  3. erez_moledet
    Member
    Posted 1 year ago #

    In question No. 4. the other website is the one mentioned in question No. 3.

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    4. Your website uses large file-sized images.

  5. erez_moledet
    Member
    Posted 1 year ago #

    Thanks for the quick replies.

    How do I make headers and images files small sized?

  6. Andrew
    Forum Moderator
    Posted 1 year ago #

    Try saving files as .png extension.

  7. Jose Castaneda
    Member
    Posted 1 year ago #

    2. *element* { margin:0; padding: 0;}

    3. .nav a:hover { text-decoration: underline; }

    4. The images that you are using take much longer than those of the site you are comparing it to. I suggest you try using smaller dimensions for images in order to keep file size down a bit.

  8. untamedlady
    Member
    Posted 1 year ago #

    Just put my blog up, however, I can't get rid of the extra links right below the heading image where the "Home" link is. How can I remove these pages, and reduce that grey panel? Here is my blog:

    http://untamedlady.com/blog/

    thanks!
    Alex

  9. Andrew
    Forum Moderator
    Posted 1 year ago #

    Those extra link are probably part of the default navigation, which grabs all the pages created through the Dashboard.

    You could create a custom menu; Appearance > menus, and add fewer selected pages to the menu.

  10. alchymyth
    The Sweeper & Moderator
    Posted 1 year ago #

    @untamedlady

    please start your own topic.

    you problem is different from the current topic.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.