-
المساهمات
6975 -
تاريخ الانضمام
-
تاريخ آخر زيارة
-
عدد الأيام التي تصدر بها
218
إجابات الأسئلة
-
إجابة Wael Aljamal سؤال في مشكلة في برنامج Visual Studio2022 عند اضافة View كانت الإجابة المقبولة
بالضغط بالزر اليمين على اسم المشروع وندخل ع NuGet ثم نحدد الحزمة للتحميل Windows.web.VisualStudio.Design ثم نكتب أمر التثبيت Install-Package Windows.web.VisualStudio.Design -Version 5.0.1 ثم نعيد تشغيل virtual studuio -
إجابة Wael Aljamal سؤال في كيف يمكننى ان اجعل ال Splash screen تملئ الشاشة كانت الإجابة المقبولة
هل يمكنك تعديل ملف drawable.xml:
نضيف الخاصية android:scaleType=centerCrop لتمديد الصورة بشكل مناسب من المنتصف مع عمل قطع لتناسب جميع مقاسات الشاشات <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:opacity="opaque"> <item> <bitmap android:src="@mipmap/splash_screen" android:scaleType="centerCrop" /> </item> </layer-list> ولم أتأكد من وجود خطأ في المكتية يحيث تم عمل تعديل كالتالي
ImageView view = new ImageView(context); view.setImageResource(mDrawableResId); view.setScaleType(ImageView.ScaleType.CENTER_CROP); لتطبيق التمديد في الملف الذي مساره
react-native-bootsplash/android/src/main/java/com/zoontek/rnbootsplash/RNBootSplashModule.java كما يوجد مكتبة لها نفس الاسم مع FullScreen هلا قمت بتجريبها
الرابط: react-native-bootsplash-fullscreen
-
إجابة Wael Aljamal سؤال في كيفية مشاركة السيرفر المحلي بين الاجهزة كانت الإجابة المقبولة
نعم يمكنك الوصول للمخدم من خلال عنوان ip المحلي على الشبمة المنزلية، أدخل عنوان الحاسوب في الجوال ضمن المتصفح وحاول فتح الصفحة، بحيث تأكد من تحديد الشبمة ضمن نظام ويندوز ك خاصة private لتصبح الحاسوب متاح على الشبكة. وأدخل ip الحاسوب في الهاتف مثل 192.168.1.7 حسب مالديك و سيتم عمل الاستعلام بشكل صحيح
يمكنك ضبط إعدادات الشبكة لاحقا على static ip لكي لايتغير عنوان الحاسوب على الشبكة. و يبقى نفس ال ip للخادم.
-
إجابة Wael Aljamal سؤال في ما هي دورة أكاديمية حاسوب الأولى للمبتدىين كانت الإجابة المقبولة
تعتبر دورة علوم الحاسب هي الدورة العامة التي تعطيك فكرة عن جميع تخصصات علوم الحاسب، و تدرس بها لغتي جافاسكربت و بايثون كل منها في مسار. وتتعرف على قواعد البيانات و سطر نظام لينكس وغيره تجده في وصف الدورة. و سوف تتعلم مبادئ البرمجة و الأحداث وفي مسار سكراتش ايضاً وهي لغة برمجة مبسطة تقويك في الخوارزميات
وإن شراء دورة واحدة يفتح لك أول مسار من باقي الدورات، حينها ستتمكن من تحديد التخصص الذي ستجده مناسبا لك،
بالتوفيق
-
إجابة Wael Aljamal سؤال في كيف أبحث في جدول معين بغض النظر عن حالة الأحرف في لارافيل Laravel؟ كانت الإجابة المقبولة
يمكنك تبديل معامل التشابه like ب ilike ليصبح case-insensitive فيتم تجاهل حالة الأحرف
User::where('name', 'iLIKE', '%' . $value . '%' ); وهي الطريقة الأبسط،
يمكن أيضاً بطريقة كلاسيكية تحويل جميع المحارف للحالة الكبيرة capital | Upper وعمل البحث
Model::whereRaw("UPPER('{$column}') LIKE '%'". strtoupper($value)."'%'");
-
إجابة Wael Aljamal سؤال في كيفية تحويل قيمة منطقية Boolean إلى نص string في PHP؟ كانت الإجابة المقبولة
يمكن استخدام المعامل الثلاثي لفحص قيمة المتغير البولياني ومن ثم طباعة سلسلة نصية موافقة
echo $bool_val ? 'true' : 'false'; كما يمكن استخدام دالة json_encode
$bool = false; echo json_encode($bool); // 'false' $bool = true; echo json_encode($bool); // 'true'
-
إجابة Wael Aljamal سؤال في استخدام الشروط المتلاحقة if else if else في لغة ++C كانت الإجابة المقبولة
استخدم هذا
#include <iostream> using namespace std; int main(){ int value; cout <<"Enter the sales value: " << endl; cin >> value; if (value >=9000){ cout << "Excellent" << endl; cout << " :)" << endl; }else if (value >=7000){ cout << "Very Good" << endl; cout << " :)" << endl; } else if (value >=5000){ cout << "Good" << endl; cout << " :)" << endl; } else { cout << "Need improvement" << endl; cout << " :)" << endl; } return 0; }
-
إجابة Wael Aljamal سؤال في كيفية تغير تنسيق الحقل created_at ليحتوي على تاريخ اليوم فقط في لارافيل Laravel؟ كانت الإجابة المقبولة
يمكننا إضافة الدوال accessor methods للنموذج لديك وهو post لتعديل قيم الخواص من النموذج قبل قراءتهم وكتابتهم get - set.
حيث نعتمد على الدالة formate لتطبيق تنسيق الوقت المطلوب
public function getCreatedAtAttribute($date) { return Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $date)->format('Y-m-d'); } public function getUpdatedAtAttribute($date) { return Carbon\Carbon::createFromFormat('Y-m-d H:i:s', $date)->format('Y-m-d'); } سيظهر التاريخ بالشكل التالي:
$post = Post::find(1); echo $post->created_at; // only Y-m-d مع الانتباه أنه عند تعريف الجداول في ملفات التهجير نستخدم الصنف date
$table->date('created_at'); $table->date('updated_at'); إن اقتصر استخدامك للتحويل (صيغة التاريخ) في مكان محدد ضمن ملف العرض يمكن استخدام الدالة مباشرة باستدعاء الدالة format('Y-m-d')
{{ $post->created_at->format('Y-m-d') }} كما يمكننا استخدام القصر cast في ملف النموذج
protected $casts = [ 'created_at' => "datetime:Y-m-d\TH:iPZ", ];
-
إجابة Wael Aljamal سؤال في تغير موقع موشر الماوس في textformfield في flutter كانت الإجابة المقبولة
يبدو أنها عبارة عن خطأ أو سهوة برمجية في المكتبة Big بسيطة.
سوف نحاول نقل مؤشر الكتابة عن طريق الكود التالي:
بعد إسناد النص في شيفرة المتحكم نقوم بنقل مؤشر الكتابة لنهاية النص fromPosition تحدد بداية النص مكان الكتابة تم تحديد طول النص من خلال controller.text.length يمكنك وضعه بأي قيمة مثلاً من طول السلسة التي تستخدمها controller.text = '...'; النص controller.selection = TextSelection.fromPosition(TextPosition(offset: controller.text.length));
-
إجابة Wael Aljamal سؤال في اكتب برنامج يطبع أكثر رقم مكرر في القائمة list كانت الإجابة المقبولة
أرجو وضع الشيفرة كنص ضمن التعليق وليس كصورة و يمكنك استخدام محرر الأكواد <> لتنسيقها.
لحل المشكلة عليك الاحتفاظ بقيمة أكبر تكرار موجود ضمن السلسلة و قيمة العنصر الموافقة له و لكل تكرار في الحلقة نقارن، هل تكرار هذا العدد اكبر من اكبر تكرار؟ فنقوم بتعديل اكبر تكرار و قيمة العدد الموافقة له.
يمكنك إضافة متغيرين mostFrequent نحفظ فيه أكبر تكرار لقيمة. و القيمة mostFrequentValue و حاول عمل البرنامج بهذه الطريقة
List = [2, 1, 2, 2, 1, 3] counter = 0 # نفرض أكبر تكرار بقيمة 0 num = List[0] # نفرض أن العدد الأول له أكبر تكرار أو قيمة افتراضية للمسألة for i in List: curr_frequency = List.count(i) # حساب التكرار للعنصر الحالي if(curr_frequency> counter): # هل تكرار العنصر الحالي هو أكبر من جميع العناصر السابقة counter = curr_frequency # تعديل أكبر تكرار num = i # تعديل الرقم ذو صاحب أكبر تكرار print(num)
-
إجابة Wael Aljamal سؤال في كيفية الحصول على كل ترويسات الطلب request headers في PHP؟ كانت الإجابة المقبولة
يمكننا طباعة المصفوفة Server بالكامل من خلال الدالة print_r مع تمرير عنوان URL
<?php print_r($_SERVER[URL]) ?> كما يمكن استدعاء الدالة getallheaders للطلبية الحالية
يمكن طباعتها بشكل JSON
echo json_encode(getallheaders()); أو مصفوفة أو بشكل نصي:
<?php $headers = getallheaders(); foreach($headers as $key=>$val){ echo $key . ': ' . $val . '<br>'; }
-
إجابة Wael Aljamal سؤال في كيفية الحصول على عدد الوظائف jobs التي لم تنفذ بعد pending في لارافيل Laravel؟ كانت الإجابة المقبولة
يتم وضع العمليات JOBs في رتل Queue قبل دخولها حيز التنفيذ، لذلك معرفة حجم الرتل، يعطينا عدد العمليات قد الانتظار. حيث نستخدم الدالة size من الصنف Queue ونمرر لها اسم الرتل
Queue::size($queue); كما توفر لارافل الكئان
Illuminate\Bus\Batch الذي يتوفر عدة خواص:
العمليات التي لم تبدأ:
// عمليات قيد الإنتظار processed jobs ... $batch->pendingJobs; عمليات أخرى:
<?php // UUID المعرف الخاص $batch->id; // الاسم $batch->name; // العدد الكلي للعمليات $batch->totalJobs; // غير مكتملة | فشلت $batch->failedJobs; // المكتملة $batch->processedJobs(); // نسبة الإكمال (0-100)... $batch->progress(); // التأكد من إنتهاء العملية $batch->finished(); // إلغاء العملية $batch->cancel(); // Indicates if the batch has been cancelled... $batch->cancelled();
-
إجابة Wael Aljamal سؤال في مشكلة في محاذاة عناصر في لارافل و بوتستراب 5 كانت الإجابة المقبولة
إن التنسيق الذي يؤثر على الأسهم هو margin
في بوتستراب 5 تم استبدال ml mr ب ms - me أي start - end حسب جهة بداية الصفحة بدل يمين و يسار..
حاول إضافة تنسيق مخصص لها
-
إجابة Wael Aljamal سؤال في يظهر لي الخطأ Notice: Undefined variable في PHP كانت الإجابة المقبولة
المتغير pass2 تم استخدامه ضمن المقارنة في عبارة if قبل أن يتم تهيئته وإعطائه قيمة فهو غير معرف undefined.
يجب أن يتوفر طريقة في إرسال الاستمارة مثل زر من نوع submit
<input type="submit" name="mybutton"> ثم تأكد من اختبار الحقول قبل قراءة قيمتهم
<?php if(isset($_POST['create1_pass']) && isset($_POST['create1_pass']) ){ $pass2 = $_POST['create1_pass']; $password = $_POST['create1_pass']; if($password === $pass2){ echo 'done'; }} هذا هو الترتيب المنطقي للتحقق
-
إجابة Wael Aljamal سؤال في إسناد قيم لعدة أعمدة في جدول SQL بلغة PHP كانت الإجابة المقبولة
ماهي رسالة الخطأ التي تظهر؟ أرجو إرفاق كامل الملف
الشكل العام لحشر البيانات في جدول SQL هو كالتالي:
INSERT INTO MyTable ( Column1, Column2 ) VALUES ( Value1, Value2 ) أي
$addData = $database->prepare(" INSERT INTO hijazi (Email, Password) VALUES ('$Email','$password') "); $addData->execute(); شيفرتك صحيحة تأكد من باقي الملف
-
إجابة Wael Aljamal سؤال في كيفية تحديد عنصر فعال | مختار من بين عدة عناصر و خطأ بالوصول لعنصر ضمن classList في لغة الجافا سكريبت كانت الإجابة المقبولة
لنفرض لدينا قائمة من العناصر القائمة لها صنف items و العناصر item-option
<ul class="items"> <li class="item-option" data-item="0">1</li> <li class="item-option" data-item="1">2</li> <li class="item-option" data-item="2">3</li> <li class="item-option" data-item="3">4</li> <li class="item-option" data-item="4">5</li> </ul> في حال أردنا تطبيق صنف فعال على عنصر وحيد، يمكننا عند النقر على زر، حذف الصنف من جميع العناصر ثم إضافته للعنصر المنقور عليه.
// جلب جميع العناصر const itemOptions = document.querySelectorAll('.items .item-option'); // المرور بحلقة itemOptions.forEach((item, i) => { // حدث الاستماع للنقر على عناصر المصفوفة item.addEventListener('click', element => { // نزع الصنف selected // من جميع العناصر timeOptions.forEach(option => { option.classList.remove('selected'); }) // إضافة الصنف للعنصر الذي وقع عليه حدث النقر element.classList.add('selected'); }); }); وفي حال الاستفادة من data-item التي فيها قيمة مميزة لكل عنصر
const itemOptions = document.querySelectorAll('.items .item-option'); itemOptions.forEach((item, i) => { // جلب ترقيم العنصر const domIndex = item.getAttribute('data-item'); item.addEventListener('click', () => { timeOptions.forEach(option => { option.classList.remove('selected'); }) // إضافة الصنف للعنصر المنقور if (i == domIndex) { item.classList.add('selected'); } }); });
وفي حال أردت استخدام جيكويري
const $items = $(".items .item-option"); $items.on("click", function() { $items.removeClass("selected"); $(this).addClass("selected"); }); نجلب العناصر ثم نطبق حدث النصر على الجميع، وفيه نزيل الصنف من جميع العناصر ثم نضيفه للعنصر المنقور عليه
-
إجابة Wael Aljamal سؤال في كيفية التبديل بين الوضع غامق و الفاتح dark and light mode في css كانت الإجابة المقبولة
هل تأكدت من أن وضع المتصفح هو تلقائي (حسب النظام) وليس ثابت Dark دائماً، أي لم تقم أيضاً بتثبيت ثيم داكن مخصص. وتأكد من تحديث الصفحة.
ويجب اغلاق المتصفح وإعادة فتحه ليأخذ بالتعديلات عند تغييرها في نظام التشغيل. -
إجابة Wael Aljamal سؤال في كيفية تخزين مصفوفة باستخدام mongoose وقرائتها من جيكويري jQuery من صفحة HTML كانت الإجابة المقبولة
إن طريقةاستقبال رد 201 تختلف عن 200 هل يمكنك تجريب رد حالة 200
أين تقرأ الرد ب undefined?
serializearray ضرورية لأن اي شيء يتم تمثيله كسلسلة نصية لنستطيع وضعه في قاعدة البيانات، فهي لاتقبل تخزين كائنات برمجية مباشرة
-
إجابة Wael Aljamal سؤال في كيفية معرفة حجم الملف الذي تم رفعه في لارافيل Laravel؟ كانت الإجابة المقبولة
يتوفر الدالة getSize التي تعيد حجم الملف بال bytes ويمكن استدعائها بالطريقة التالية:
$imageSize = $request->file('img')->getSize(); وهي متاحة من لارافل 5 وأحدث.
كما يمكننا استخدام الواجهة Storage Facade
use Illuminate\Support\Facades\Storage; public function get_size($file_path) { return Storage::size($file_path); } وهي تدعم أيضاً الملفات المرفوعة على S3 من خلال تحديد القرص disk s3
use Illuminate\Support\Facades\Storage; public function get_size($file_path) { return Storage::disk('s3')->size($file_path); } وإن أردت الحجم بطريقة مقروءة وأوضح استعمل الدالة التالية:
<?php /** * Format bytes to kb, mb, gb, tb * * @param integer $size * @param integer $precision * @return integer */ // نمرر حجم الملف public static function formatBytes($size, $precision = 2) { if ($size > 0) { $size = (int) $size; // معرفة عدد الخانات من حساب مضاعفات 1024 بالنسبة للنظام 2 $base = log($size) / log(1024); // جلب دليل المصفوفة $suffixes = array(' bytes', ' KB', ' MB', ' GB', ' TB'); // إعادة سلسلة نصية تعيد الحجم مع اسم الواحدة return round(pow(1024, $base - floor($base)), $precision) . $suffixes[floor($base)]; } else { return $size; } } التوثيق: laravel 9 filesystem file-metadata
-
إجابة Wael Aljamal سؤال في كيفية الحصول على آخر مفتاح key في مصفوفة في PHP؟ كانت الإجابة المقبولة
انتبه عند استخدام الدالة end فهي تنقل مؤشر المصفوفة ليشير لآخر عنصر فيها، أي أن الوصول للمصفوفة بعد تنفيذ ذلك السطر سوف يستهدف آخر عنصر فقط. فهو يعيد قيمة آخر عنصر و يحرك المؤشر الداخلي للمصفوفة إليه. استخدمه بانتباه.
لاحظ الشيفرة السابقة حتى بدون الاعتماد على القيمة المعادة من end يتم الوصول للمفتاح الأخير مباشرة
<?php $user = array( 'first_name' => "user name", 'email' => "mail@gmail.com", 'age' => 34, ); end($user); $key = key($user); var_dump($key); // string(3) "age" ?> يمكننا استخدام الدالة array_slice
<?php $user = array( 'first_name' => "user name", 'email' => "mail@gmail.com", 'age' => 34, ); echo key(array_slice($user, -1, 1, true)); // age ?> يمكن استعمال end لكن مع غير المصفوفة الأصلية بشكل مباشر بل مع مصفوفة المفاتيح الخاصة بها
<?php $user = array( 'first_name' => "user name", 'email' => "mail@gmail.com", 'age' => 34, ); echo end(array_keys($user)); استعمال array_key_last مع إصدار PHP >= 7.3
طرق أخرى
آخر عنصر من مصفوفة المفاتيح echo array_keys($array)[count($array)-1]; echo array_pop(array_keys($array)); توثيق: array_keys - array_slice
-
إجابة Wael Aljamal سؤال في طريقة استخدام settimeout typescript كانت الإجابة المقبولة
بعد النقر على زر ما، نستدعي دالة تقوم بإظهار البطاقات ثم ضمنها نستدعي setTimeOut مع تمرير 2000 ميلي ثانية (2 ثانية) ليتم تنفيذ الدالة المرتبطة بها بعد هذه المدة.
في HTML
<button onclick="showCards();"> start game </button> والكود:
function showCard() { // منطق إظهار البطاقات // بعد ثانيتين ستختفي window.setTimeout(hideCards, 2000); } function hideCards() { // منطق إخفاء البطاقات }
-
إجابة Wael Aljamal سؤال في كيف أتعلم Flutter كانت الإجابة المقبولة
إن البرمجة و إطارات العمل و لغات البرمجة تتطور و تتعدل باستمرار لأن مطوري التقنيات يجدون طرق جديدة وأفضل في بناءها و كيفية تسخيرها لتحسن الأداء أو استهلاك الموارد أو زيادة الحماية.
حاليا أحدث إصدار ل Flutter هو 2 يمكنك البدء بتعلمه. وتتوفر الكثير من المصادر مثل قنوات يوتيوب، بالإضافة للتوثيق الرسمي docs.flutter.dev وقناة فلاتر على يوتيوب.
تأكد أن إصدار الكورس في النصف الثاني من 2021 أو في 2022
وتأكد طالما لديك رغبة بالتعلم سوف تستمر و إن التعديلات والتغييرات المستمرة ليست فقط في Flutter بل في مجال علوم الحاسب ككل لأنه أكثر مجال متطور و محدث
-
إجابة Wael Aljamal سؤال في كيفية التحقق من كتابة ملف xml-Entity References كانت الإجابة المقبولة
للتحقق من ملف XML:
نتأكد من أن كل وسم تم فتحه يجب إغلاقه بنفس الاسم وأن تداخل العناصر سليم من تم فتحة أخيراً نغلقه أولاً
<abc> <cde> </cde> </abc> وفي مثالك:
<funcdef> <function>ctime</fnuction> <!-- ^^^^^^^^^ ^^^^^^^^^^^ --> </funcdef> لانضع فراغات في اسم الوسم أو وسم الإغلاق
<parameter> time < /parameter>,as returned by ^^^ لا نقوم بتعريف نفس الخاصية أكثر من مرة
<para><emphasis role="strong" targetgroup="beginners" role="strong"> ^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^ وبالنسبة ل
&doubleclick; هنا نقوم بجلب قيمة Entity References بدون أن تكون معرفة مسبقاً يجب وضع قيمة لها
<!DOCTYPE definition [ <!ENTITY red " & # 1 7 4 ;"> مثال <!ENTITY ampdoubleclick "&doubleclick;"> ]> حيث ان "&doubleclick;" هي القيمة التي نريدها <!ENTITY ampdoubleclick "132131"> أي جميع هذه ال Reference يجب أن يتم تعريفها مسبقاً لنستطيع قراءة قيمتها لاحقا
<?xml version="1.0"?> <!DOCTYPE definition [ <!ENTITY ampdoubleclick "1231"> <!ENTITY ampbuttonleft "9987"> <!ENTITY ampidhelp782 "979798"> <!ENTITY ampidhelp785 "983759"> ]> <function> <title>ctime</title> <funcsynopsis> <funcdef> <function>ctime</function> </funcdef> <paramdef> <parameter>time</parameter> <parameter role="opt">gmt</parameter> </paramdef> </funcsynopsis> <para>This function converts the value <parameter> time </parameter>,as returned by <function>time()</function> <function>file_mtime()</function>, into a string of the form produced by <function>time_date()</function>. If the optional argument <parameter>gmt</parameter> is specified and non-zero,the time is returned in <parameter>gmt</parameter>. Otherwise, the time is given in the local time zone. </para> <para><emphasis role="strong" targetgroup="beginners"> Related topics</emphasis> </para> <para>&doubleclick; the <mousebutton>LEFT &buttonleft;</mousebutton> mouse button on a topic </para> <itemizedlist> <listitem> <para><ulink url="&idhelp782;"><function>file_mtime()</function>built-in function</ulink> </para> </listitem> <listitem> <para><ulink url="&idhelp785;"><function>time()</function> built-infunction</ulink> </para> </listitem> </itemizedlist> </function>
-
إجابة Wael Aljamal سؤال في كيف احفظ Fragment او activity الي كنت فيه وارجع له بعد فتح التطبيق كانت الإجابة المقبولة
عند كل تنقل إلى Fragment ما، علينا حفظ هذا الانتقال مثل الاحتفاظ برقمه مثلاً.
وبذلك عند فتح التطبيق نقرأ قيمة shared preff وفيه رقم آخر Fragment وبذلك نفتحه.
عملية تحديث رقم Fragment في كل مرة ننتقل لواحد مختلف (مكررة في كل Fragment ) عملية قراءة الرقم مرة واحدة عند فتح التطبيق (في Fragment الرئيسي الافتراضي) ثم فتح الFragment الهدف عند فتح التطبيق نطبق التالي:
// قراءة اسم آخر نشاط SharedPreferences preferences = getPreferences(Context.MODE_PRIVATE); SharedPreferences.Editor editor = preferences.edit(); String activityTag = editor.getString(getString(R.string.last_viewed_activity_tag), null); // نشاط افتراضي في حال فتح التطبيق لأول مرة Class initialActivityClass; // الاختيار حسب المس النشاط switch (activityTag) { case "CoolActivity": initialActivityClass = CoolActivity.class; break; case "WowActivity": initialActivityClass = WowActivity.class; break; default: initialActivityClass = MainActivity.class; break; } // إطلاق النشاط Intent intent = new Intent(this, initialActivityClass); startActivity(intent); finish(); عند تغيير fragment فقط نعمل putString بدل get و نخزن قيمة تدل على Fragment
SharedPreferences preferences = getPreferences(Context.MODE_PRIVATE); SharedPreferences.Editor editor = preferences.edit(); String activityTag = editor.putString(R.string.last_viewed_activity_tag, "Fragment name / number" ); ^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
-
إجابة Wael Aljamal سؤال في إزالة الفراغات بين العناصر المتجاورة CSS كانت الإجابة المقبولة
تبين بعد تجريب الشيفرة أن الفراغ بسبب عمل سطر جديد بين الوسوم a tags
<nav> <a class="home" href="#">Home</a><a class="news" href="#">News</a><a class="contact" href="#">Contact</a><a class="about" href="#">About</a> </nav> وأحد الحلول بعمل تعليق بشكل غريب كالتالي
<ul> <li>Item 1</li><!-- --><li>Item 2</li><!-- --><li>Item 2</li> </ul> المهم عدم وجود فراغ بين بداية و نهاية وسم،
أو يمكنك تطبيق float left أو display flex