Skip to main content

Hr (horizontal line) style in FireFox vs IE vs Chrome - Simplest Simple feature doesn't work same - Hope you can save some time.


ISSUE:
I wasted few minutes figuring out World's simplest simple issue 'drawing a single line' with 1pixel width and a color in html that looks same in at least 3 browsers ( Firefox, IE, Chrome )

I just want to do a simple  code like,

 <hr style="color:#ff6a00; " 
- Firefox: Shows the line with given color but with a border. (Thats good. 4 Stars for Firefox team)
- IE: Shows line with default 'gray' with default width
- Chrome: Shows line with default 'gray' with default width
 

(depending on the browser you are looking - the above line will show as mentioned above)

<hr style="color:#ff6a00;  height: 1px; border: 0; width: 100%; " > 
 

All 3 Browsers: No Show - No line
Even if you try increasing border and height, 
<hr style="color:#ff6a00;  height: 10px; border: 3px; width: 100%; " >
it will not show the line.

FIX: 

You have to use the background-color: #ff6a00; attribute to draw the line!
 <hr style="color:#ff6a00;  background-color: #ff6a00; height: 1px; border: 0; width: 100%; " > 



I have no idea why this has to be this way for a simplest simple horizontal line in html. Imagine how many hours of designers and developers wasted unproductively if you just have to make a simple line work like the same in all the 3 browsers. Good lesson for designers as well as for the companies to see how simple things will drag your productivity.


Comments

Popular posts from this blog

LLM on Mobile Phone : Mini Universal data and assistant running on an android smart phone Galaxy S23

  Imagine a world where everyone has access to a mini #OpenAI's #ChatGPT on their mobile phone, answering any question on any topic, right from their local phone memory. No need for internet. This is the future of #LLMs on mobile devices, and it's happening now. #MLC-AI has created a way to install a 3 billion parameter #RedPajam #LLMModel on a #Galaxy #S23 smartphone. This is a powerful #LLM that can generate text, translate languages, write different kinds of creative content, and answer your questions in an informative way. And it's all available on your phone, without the need for an internet connection. This could have a profound impact on people all over the world. Millions of suburban students who don't have access to the internet could now have access to a universal data source that can answer most of their questions. Refugee camps around the world could also benefit from this technology, giving refugees access to information and resources that they might not ot...

Javascript 3 dimentional matrix html board onclick empty current box

javascript 3 dimentional matrix html board onclick empty current box  Algorithm! Rules: 1. Only immediate Box can be swapped. Should not jump another box 2. Only directions allowed: Left, Right, Up, Down. 3. Should not swap diagonally.   See the Pen 3d matrix map numbers. by PV ( @moorthi07 ) on CodePen .   function hasClass(elem, className) {   return elem.className.split(" ").indexOf(className) > -1; } function addClick() {   var btn = '<button class="btn1">kkkkk</button>';   document.getElementById("container").innerHTML += btn; } // function boxbodyClick(obj) { //   /* console.log(';;;',obj.className) */ //   /* alert(obj) */ // } var arr = [3]; for (var i = 0; i < 3; i++) {   arr[i] = new Array(3); } var emti = 0; var emtj = 0; function btnClick(obj, i, j) {   if (arr[i][j] !== "-") {            if (j + 1 == emtj || j == emtj || j - 1 == emtj)...

Agentic AI growth could make GenAI providers to charge $1000-$2000 per month - #Cathywood , here is how.

      #Cathywood predicts that as the #agenticgenai grows the #GenAI service providers like openai, gemini, Copilot, etc will be able to charge $1000 - $2000 per month to their business customers. And she adds, "this is going to happen". Why this is important: Remember #Cathywood made a monster call in 2018, predicting that Tesla would hit $4,000 in five years. And eventually Tesla hit Wood's price target, with shares closing at $816, or $4,080 on a split adjusted basis (Jan. 2021). How this could happen: #AgenticGenAi means , 1. Integrating a business service with GenAI providers like Gemini/ChatGPT as an agent and make available in the chat interface. 2. Less human interaction and more calls to the GENAI Models. Nothing totally new, its similar to 'Ok google play a song from spotify' 'Alexa, order 8 pack dove on amazon' For example, when booking a flight, instead of navigating a complex travel website, users can simply provide a text prompt...