tejasamrute
-
Posts
132 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Everything posted by tejasamrute
-
tried it on server..it is taking full width.... can you please put it on your server n check.....maybe this is server issue or something coz coding seems perfect...
-
How to keep the formatting of a Web page by changing the monitor?
tejasamrute replied to alpha45's topic in HTML/XHTML
you will have to make your web page responsive to fit in all resolutions http://www.w3schools.com/bootstrap/default.asp -
The columns are showing full width in IE7 & 8 even though i have set to 'col-sm-4'. i have used bootstrap files n respond.min.js locally inorder to eliminate probs caused by CDN links.. <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="bootstrap.min.js"></script> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <script src="respond.min.js"></script> <![endif]--> <title>Untitled Document</title><style type="text/css">.container-fluid { background-color:pink;}</style></head><body><div class="container-fluid"> <h1>Hello World!</h1> <div class="row"> <div class="col-sm-4" style="background-color:lavender;">.col-sm-4</div> <div class="col-sm-4" style="background-color:lavenderblush;">.col-sm-4</div> <div class="col-sm-4" style="background-color:lavender;">.col-sm-4</div> </div></div></body>
-
thanks....ingolme..i will have to find another jquery
-
http://bootsnipp.com/snippets/featured/multi-level-navbar-menu Check this link
-
Hello Folks, I am trying to edit Circliful Jquery....but i am having 2 troubles: Not Compatible with IE 9,8,7 (Did not check it in ie 10 & 11 as i don't have it) and also Safari. Since these stats will be at the bottom of my page.. i want the animation to start when i scroll down to the stats block (default animation starts at the load of the page). https://github.com/pguso/jquery-plugin-circliful Link of the Jquery This is how my code looks like CSS .circliful { position: relative; float:left; color:#fff;}.circle-text, .circle-info, .circle-text-half, .circle-info-half { width: 100%; position: absolute; text-align: center; vertical-align:middle; display: inline-block;}.a5 { height:800px; width:100%; background-color:#c62229;}.a1 { height:800px; width:100%; background-color:blue;}.a2 { height:800px; width:100%; background-color:green;}.a3 { height:800px; width:100%; background-color:orange;} HTML <div class="a1"></div><div class="a2"></div><div class="a3"></div><div class="a4"></div><div class="a5"><div id="myStat1" data-dimension="250" data-text="35%" data-info="New Clients" data-width="30" data-fontsize="38" data-percent="35" data-fgcolor="#ffffff" data-bgcolor="#d4595f"></div><div id="myStat2" data-dimension="250" data-text="48%" data-info="New Clients" data-width="30" data-fontsize="38" data-percent="48" data-fgcolor="#ffffff" data-bgcolor="#d4595f"></div><div id="myStat3" data-dimension="250" data-text="56%" data-info="New Clients" data-width="30" data-fontsize="38" data-percent="56" data-fgcolor="#ffffff" data-bgcolor="#d4595f"></div><div id="myStat4" data-dimension="250" data-text="62%" data-info="New Clients" data-width="30" data-fontsize="38" data-percent="62" data-fgcolor="#ffffff" data-bgcolor="#d4595f"></div></div><script>$( document ).ready(function() { $('#myStat1').circliful(); $('#myStat2').circliful(); $('#myStat3').circliful(); $('#myStat4').circliful();});</script> Help appreciated
-
Tested in Chrome, Firefox, Opera & IE 8 & 9.......your navigation looks awefully wrong in IE7
-
I tried adding links everything looks fine & perfect......Possibly you might have got a bug <div id="MenuBar"> <ul><li style="width:130px">Home</li> <li style="width:150px">About Us</li> <li style="width:200px"><a href="https://www.google.com" target="_blank">Our Services</a><ul> <li style="width:200px"><a href="http://www.microsoft.com" target="_blank">VOIP</a></li> <li style="width:200px"><a href="http://www.ebay.com" target="_blank">Broadband</a></li> <li style="width:200px; border-bottom-left-radius:10px; border-bottom-right-radius:10px;"><a href="http://amazon.com" target="_blank">Fixed Lines and Calls</a></li> </ul> </li> <li style="width:200px"><a href="https://www.msn.com" target="_blank">Our Systems</a> <ul> <li style="width:200px">BT</li> <li style="width:200px">Panosonic</li> <li style="width:200px; border-bottom-left-radius:10px; border-bottom-right-radius:10px;">Etc</li> </ul> </li> <li style="width:170px">Testimonies <ul> <li style="width:170px">Charities</li> <li style="width:170px">Schools</li> <li style="width:170px; border-bottom-left-radius:10px; border-bottom-right-radius:10px;">Businesses</li> </ul></li> <li style="width:174px">Contact Us</li> </ul></div>
-
Not all web page content is displayed (Firefox, IE, Chrome)
tejasamrute replied to boylesg's topic in CSS
CSS content{ color:#000000; /*You have added " in your code*/} HTML Navigation is not properly closed <div class="columns"> <nav class="navigation"> <ul class="NavMenu"> <li class="NavMenuItem"><a href="index.php">Home</a></li> <li class="NavMenuItem"><a href="AboutMe.php">About me</a></li> <li class="NavMenuItem"><a href="Contact.php">Contact Details</a></li> <li class="NavMenuItem"><a href="PreviousJobs.php">Previous Jobs</a></li> <li class="NavMenuItem"><a href="Definitions.php">Definitions</a></li> <li class="NavMenuItem"><a href="EnvironmentalWeeds.php">Environmental Weeds</a></li> <li class="NavMenuItem"><a href="GardenTips.php">Garden Tips</a></li> <li class="NavMenuItem"><a href="NativeLawns.php">Native Lawns</a></li> <li class="NavMenuItem"><a href="OnlineNursery.php">Online Nursery</a> <div class="NavMenuItemArrow"><a href="#" id="NavMenuItemArrow" onclick="doOnClick('NavMenuItemArrow', 'NavSubmenu')">▼</a> <ul class="NavSubmenu" id="NavSubmenu"> <li id="NavMenuItem"><a href="Category1.php">Bush Tucker</a></li> <li id="NavMenuItem"><a href="Category2.php">Lily & Iris Like Plants</a></li> <li id="NavMenuItem"><a href="Category3.php">Small Plants</a></li> <li id="NavMenuItem"><a href="Category4.php">Climbers</a></li> <li id="NavMenuItem"><a href="Category5.php">Ferns</a></li> <li id="NavMenuItem"><a href="Category6.php">Ground Covers</a></li> <li id="NavMenuItem"><a href="Category7.php">Aquatic Herbs</a></li> <li id="NavMenuItem"><a href="Category8.php">Aquatic Reeds & Rushes</a></li> <li id="NavMenuItem"><a href="Category9.php">Grasses</a></li> <li id="NavMenuItem"><a href="Category10.php">Grass Like Plants</a></li> <li id="NavMenuItem"><a href="Category11.php">Small Shrubs</a></li> <li id="NavMenuItem"><a href="Category12.php">Medium Shrubs</a></li> <li id="NavMenuItem"><a href="Category13.php">Large Shrubs</a></li> <li id="NavMenuItem"><a href="Category14.php">Small Trees</a></li> <li id="NavMenuItem"><a href="Category15.php">Medium Trees</a></li> <li id="NavMenuItem"><a href="Category16.php">Large Trees</a></li> <li id="NavMenuItem"><a href="Category17.php">Lawn Seeds</a></li> <li id="NavMenuItem"><a href="Category18.php">Nest Boxes</a></li> /*Below lines are missing from your code*/ </ul> </div> </li> </ul> </nav> </div> Implement this is see if it works -
.video-wrapper { width: 600px; max-width: 100%;} .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;} .video-container iframe,.video-container object,.video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} <div class="video-wrapper"> <div class="video-container"> <iframe src="https://www.youtube.com/embed/61TAqY03xwk" frameborder="0" allowfullscreen></iframe> </div></div> Try This...
-
Variable line heights within a list: is it possible?
tejasamrute replied to Bert Coules's topic in HTML/XHTML
have you tried this? li:nth-child(3) { line-height: padding: } Please check browser compatibility -
you might need Modernizer as download attribute is not supported by all the browsers http://caniuse.com/#feat=download
-
have you tried this? <a href="source-of-the-image" download> <input name="button" type="button" /></a>
-
the link which you attached is not working......Can you upload your code on a server n show what wrong is happening?
-
CSS - * { margin:0; padding:0; } body, html { height:100%; } .wrapper { width:100%; height:100%; background-color:#003E61; } .title { width:400px; height:100px; margin:0 auto; background-color:red; text-align:center; line-height:100px; } .menu { width:50px; height:30px; position:absolute; background-color:yellow; z-index:100; left:90%; top:8%; text-align:center; line-height:30px; } </style> HTML - <div class="wrapper"> <div class="title"><h1>Title</h1></div> <div class="menu">Menu</div></div> Is this what you wanted @Bert Coules???
-
<!DOCTYPE html><html><head> <meta charset="utf-8" /> <link rel="stylesheet" type="text/css" href="css/font-awesome.css" /> <style type="text/css"> .container { width:920px; height:auto; margin:0 auto; background-color: #C96; } .container ul li { margin:0; padding:0; list-style:none; } .container li { font-family: Arial, Helvetica, sans-serif; float: left; width: 117px; background-color: #001932; height: auto; border:1px solid #e0e0e0; text-align: center; color: #FFF; font-weight: bold; } .container li .fa { text-align:center; font-size:35px; padding-top:10px; padding-bottom:3px; } .container li a { display:block; color:white; text-decoration:none; width: 117px; height:100%; } .container li a:hover { background: #536d85; /* Old browsers */background: -moz-linear-gradient(top, #536d85 0%, #07233e 100%); /* FF3.6+ */background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#536d85), color-stop(100%,#07233e)); /* Chrome,Safari4+ */background: -webkit-linear-gradient(top, #536d85 0%,#07233e 100%); /* Chrome10+,Safari5.1+ */background: -o-linear-gradient(top, #536d85 0%,#07233e 100%); /* Opera 11.10+ */background: -ms-linear-gradient(top, #536d85 0%,#07233e 100%); /* IE10+ */background: linear-gradient(to bottom, #536d85 0%,#07233e 100%); /* W3C */filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#536d85', endColorstr='#07233e',GradientType=0 ); /* IE6-9 */color:yellow;}.container li a:hover .fa { color:white;} </style> </head><body><div class="container"> <ul> <li><a href="#"><i class="fa fa-home"></i><br>Home</a></li> <li><a href="#"><i class="fa fa-volume-off"></i><br>Speaker</a></li> <li><a href="#"><i class="fa fa-search"></i><br>Search</a></li> <li><a href="#"><i class="fa fa-music"></i><br>Playlists</a></li> <li><a href="#"><i class="fa fa-music"></i><br>Artists</a></li> <li><a href="#"><i class="fa fa-music"></i><br>Decades</a></li> <li><a href="#"><i class="fa fa-music"></i><br>Compilation</a></li> </ul> <div style="clear:both"></div></div></body></html> I have used font awesome instead of images for the icons...
-
Instead of going with padding in li a you will have to use fixed width in li li a { line-height: 50px; display: block; height: 50px; color: rgb(59, 59, 59); font-family:'Dosis', sans-serif; font-weight: 500; text-decoration: none; font-size: 16px; background-color: lightgrey;} li { white-space: nowrap; border: 2px solid #555555; float: left; width:312px; /* As per your requirement */ text-align:center;}
-
It is purely for SEO.....but there is always a fear to use too much cite as google may take it as duplicate content and may affect your site ranking..
-
i just realised... the reason i attached the design of the header was to show the variation in the length of the texts.....they are headers of different pages
-
I want to create a dynamic header like the image attached... By dynamic i mean the borders should adjust according to the length of the text Help Appreciated
-
Difference betwwen html, xhtml, xml, DHTML and CSS
tejasamrute replied to confidence123's topic in HTML/XHTML
HTML enables u to create documents and web pages that can be read by all web browsers. It contains predefined tagsXML enables u to store data in a structured format by using meaningful tags (user defined tags). XML is a cross-platform, h/w and s/w independent markup language.XHTML has the same depth of expression as HTML, but also conforms to XML syntax. DHTML stands for Dynamic HTML and is a combination of static code like HTML, and dynamic scripting languages like JavaScript, used to create interactive and animated websites. Css Stands for Cascading Style Sheet dictates your website’s look and feel.Font size, font color, font type, styling around images, page layout, mouse-over effects and more are all determined by CSS. -
You can also use p { margin-bottom:1em; } p:nth-child(2) { margin-bottom:1.5em; } <p>Paragraph 1</p> <p>Paragraph 2</p> <p>Paragraph 3</p> PS - Check :nth-child browser compatibility
-
Pure HTML <p style="margin-bottom:1em">Paragraph 1</p> <p style="margin-bottom:1.5em">Paragraph 2</p> <p style="margin-bottom:2em">Paragraph 3</p> OR HTML with CSS .paramargin1 { margin-bottom:1em; } .paramargin2 { margin-bottom:1.5em; } <p class="paramargin1">Paragraph 1</p> <p class="paramargin2>Paragraph 2</p> <p class="paramargin1">Paragraph 3</p>
-
How Do I Make All Backgrounds Grey without Affecting Images?
tejasamrute replied to koolx's topic in CSS
To be able to understand better, please attach screen shots of your browser view -
Centre class elements within a div which remain centred during scaling
tejasamrute replied to jools's topic in CSS
CSS......... #master { background-color: #0CF; height: 100px; width: 700px; margin:0 auto;}#master1 { background-color: #069; height: auto; width: 700px; margin:20px auto;}#child1 { background-color: red; height: 500px; width: 340px; float:left;}#child2 { background-color: green; height: 500px; width: 340px; float:right;} HTML..... <div id="master"></div><div id="master1"> <div id="child1"></div> <div id="child2"></div></div>
