html - Blue underline and responsive image -
i'm newbie @ coding , have questions. hope can me figure out did wrong.
have image under text. when browser it's 100 % width looks should be. when resize browser in order see if it's responsive, image don't move same time text , stay on middle of page. text it's responsive, looks fine, image it's driving me crazy. can see image under text when resize browser ?
html
<!doctype html> <head> <meta charset="utf-8"> <title>alco - blog</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="css/normalize.css"> <link rel="stylesheet" type="text/css" href="css/webflow.css"> <link rel="stylesheet" type="text/css" href="css/alcotemplate.webflow.css"> <script src="https://ajax.googleapis.com/ajax/libs/webfont/1.4.7/webfont.js"></script> <script> webfont.load({ google: { families: ["montserrat:400,700","lato:100,100italic,300,300italic,400,400italic,700,700italic,900,900italic"] } }); </script> <script type="text/javascript" src="js/modernizr.js"></script> <link rel="shortcut icon" type="image/x-icon" href="https://y7v4p6k4.ssl.hwcdn.net/placeholder/favicon.ico"> <link rel="apple-touch-icon" href="images/webclip-slate.png"> </head> <body> <header class="navbar"> <div class="w-container"> <div class="w-row"> <div class="w-col w-col-4 w-clearfix"> <img class="logo" src="images/logo.png" alt="53a187e6c2e6cb0d0ecbc4a3_logo.png"> </div> <div class="w-col w-col-8 nav-column"><a class="nav-link" href="#">home</a><a class="nav-link" href="#page-nav-share">about</a><a class="nav-link" href="#">portfolio</a><a class="nav-link" href="#">blog</a><a class="nav-link" href="#">contact</a> </div> </div> </div> </header> <section class="w-container"> <h4>blog</h4> <img class="image" src="images/untitled-1.png" alt="53a1bc1164a4f9aa1001d86e_untitled-1.png"> <p>lorem ipsum dolor sit amet, consectetur adipiscing elit. mauris eget quam orci.</p> </section> <div class="w-container container"> <div class="blog"> <div class="border"> <img class="scale-with-grid" src="images/blogpost.png" /> <h5><a href="blog-post.html">neque porro quisquam est qui lorem ipsum.</a></h5> <h3>our team</h3> <img class="image" src="images/untitled-1.png" alt="53a1bc1164a4f9aa1001d86e_untitled-1.png"> <p>at vero eos et accusamus et iusto</p> </div> <div class="section grey footer"></div> <img src="images/footer.png" alt="53a425b2eaa4a69a21bd719e_footer.png"> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="js/webflow.js"></script> <!--[if lte ie 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/placeholders/3.0.2/placeholders.min.js"></script><![endif]--> </body> </html>
would highly appreciated if can me.
forward hear you.
as don't provide code it's hard out... however, text link blue color , underline, can change link visuals css so:
/* unvisited link */ a:link { color: #ff0000; } /* visited link */ a:visited { color: #00ff00; } /* mouse on link */ a:hover { color: #ff00ff; } /* selected link */ a:active { color: #0000ff; }
Comments
Post a Comment